Support » Themes and Templates » Theme with responsive imagemap not working

  • Resolved Bloxxor

    (@bloxxor)


    Hey,

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

    I am using a jQuery-plugin:

    <a href="http://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)
  • 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.

    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.

    Emil Uzelac

    (@emiluzelac)

    Theme Review Admin

    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.