Theme with responsive imagemap not working

  • Resolved Bloxxor

    (@bloxxor)


    12 years, 9 months ago

    Hey,

    I am programming a wordpress-theme with a responsive imagemap-navigation.

    I am using a jQuery-plugin:

    <a href="https://mattstow.com/experiment/responsive-image-maps/rwd-image-maps.html">

    Everything seems to work fine, but if the image is smaller (under ~700px) and you click a link it won`t resize the map. It stays at its original size. If you resize the window just 1px, the map is resized again.

    Please help if you can. I`ll let you know if I find a solution for this.

    Cheers, Bloxxor

    Edit: I also tried the plugin with 2 handcoded html-files, the problem is in this case not existent.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter Bloxxor

    (@bloxxor)

    Simple answer:

    The imagemap.js was in conflict with the css3-mediaqueries.js.

    Mediaqueries was loading before the imagemap-script.

    I simply had to let imagemap run first.

    I hope this will help someone.

    Thread Starter Bloxxor

    (@bloxxor)

    PS:

    a small problem remains, if you don`t put the css3-mediaqueries.js just before </body>, the performance of the site will be less.

    You have to put it in the head, because imagemap.js has to load before mediaqueries and html imagemap are loaded.

    Hi,

    Not related to my Responsive Theme, but I wanted to jump in anyways. Try respond.js instead and see if that makes a difference.

    Emil

    Put the js script it the footer and there will be no issue with it loading to soon, also it worked best with a small change to the code…

    <script src="/wp-content/themes/your-theme/js/jquery.rwdImageMaps.min.js"></script>
<script>
jQuery(document).ready(function(e) {
	jQuery('img[usemap]').rwdImageMaps();

});
</script>

    Hi there,
    Code noob here. Would somebody be able to walk me through the steps required to implement the plugin in my existing WordPress site?
    Thank you in advance!!!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Theme with responsive imagemap not working’ is closed to new replies.