Skip navigation
Currently Being Moderated

Fireworks CS6 Hotspots in Responsive Design

Mar 25, 2013 7:23 PM

I have created my banner  and footer images in Fireworks CS6. In both I have included logos for Facebook, Better Business Bureau, and so on.  In Fireworks I have applied hotspots on the logos for interactivity.  When I export to Fluid Grid layout in DW CS6 the hotspots do not scale and stay attached to the logo when moving to the different media sizes.  Has anyone mastered this or is this a no go? I appreciate your advice.

 
Replies
  • Currently Being Moderated
    Mar 28, 2013 8:38 AM   in reply to jlkappler

    I haven't looked into this myself, but here's a discussion on the subject with several suggestions, including a "Responsive Image Maps jQuery Plugin" by Fireworks developer Matt Stow:

     

    http://stackoverflow.com/questions/7844399/responsive-image-map

     

    In the future, you might want to look at a more standards-based method for structuring the HTML. If the links are for discrete logos, they could be separate from the banner/footer images, without the need for an image map.

     
    |
    Mark as:
  • Currently Being Moderated
    Mar 31, 2013 9:37 AM   in reply to jlkappler

    What about moving the jquery script link before the lightbox javascript and css links in the head of your document (or otherwise reordering the various jquery/plug-in/lightbox elements)? Just a thought.

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 10, 2013 5:00 AM   in reply to jlkappler

    Hey I've encountered the 'conflicting jQuery' problem before and found a few solutions:

     

    1) First would be to toggle the order they appear in the html in the head at or at the bottom .. surprisingly simple and sometimes works.

     

    2) Second solution is a little more involved (basically replacing '$' with 'jQuery')' but still easy, documented here:

    http://cssninja.tumblr.com/post/630885003/making-multiple-jquery-scrip ts-be-the-good-friends-they

     

    3) And I wrote another post entitled 'Making Slimbox Work With Image Maps' .. not exactly what you're looking for but could be useful, documented here:

    http://cssninja.tumblr.com/post/31428543818/making-slimbox-work-with-i mage-maps

     

    Peace!

    Marcus

    lyraedesign.com

    twitter.com/cssninja

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points