WordPress.org

Forums

[resolved] Theme with responsive imagemap not working (6 posts)

  1. Bloxxor
    Member
    Posted 3 years ago #

    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.

  2. Bloxxor
    Member
    Posted 3 years ago #

    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.

  3. Bloxxor
    Member
    Posted 3 years ago #

    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.

  4. Emil Uzelac
    Theme Review Admin
    Posted 3 years ago #

    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

  5. mutu
    Member
    Posted 3 years ago #

    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>
  6. rahnkim
    Member
    Posted 3 years ago #

    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!!!

Topic Closed

This topic has been closed to new replies.

About this Topic