• Resolved Matt Phillips

    (@matsp)


    Hi! Thanks for the plugin, so useful and now an essential for me ??

    I am having trouble however since adding js where for some reason the jQuery has become commented out…

    <!-- <script src='https://withnature.info/wp-includes/js/jquery/jquery.js?ver=1.12.4-wp' id='jquery-core-js'></script> -->

    I can’t work out how this has happened but it’s been going on since I’ve been adding js to create responsive image maps and I have also been talking about this subject on the developers support site if it may be of help… https://www.coffeecup.com/forums/image-mapper/image-mapper-and-wordpress–2/ the link will show you various screenshots of the code, support there has confirmed the js is correct.

    Any ideas, advice or pointers would be very welcome and gratefully received, many thanks.

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Author Diana Burduja

    (@diana_burduja)

    The WP Fastest Cache plugin comments out the jQuery and adds it back in a minified version.

    You can start by deactivating the WP Fastest Cache plugin to see if that solves your issue. If it does, then you can activate it back and then play with the plugin’s settings to see which one is commenting out the jQuery library.

    Thread Starter Matt Phillips

    (@matsp)

    Hi Diana, and my sincere thanks for your reply ??

    I’ve edited and now temporarily uninstalled any cache plugins but unfortunately, the problem I was having remains. Thank you for the info on why it’s commented out. I wonder if you might have any other ideas please? Many thanks, Matt P.

    Thread Starter Matt Phillips

    (@matsp)

    I’ve noticed when I deactivate the following custom js the layout etc returns to normal
    jQuery(document).ready(function(e) {$('img[usemap]').rwdImageMaps();});

    Plugin Author Diana Burduja

    (@diana_burduja)

    It could be that the jQuery rwdImageMaps() function isn’t defined or loaded.

    Could you make sure the jquery.rwdImageMaps.min.js file is linked? Alternatively, because the jquery.rwdImageMaps.min.js file is very small, you could copy/paste the content of the jquery.rwdImageMaps.min.js file directly in the custom JS code before your code that initiates the rwdImageMaps.

    Thread Starter Matt Phillips

    (@matsp)

    Hi Diana, thanks for your reply ??

    I have done as suggested and combined those files so it now reads as follows…

    ;(function(a){a.fn.rwdImageMaps=function(){var c=this;var b=function(){c.each(function(){if(typeof(a(this).attr("usemap"))=="undefined"){return}var e=this,d=a(e);a("<img />").load(function(){var g="width",m="height",n=d.attr(g),j=d.attr(m);if(!n||!j){var o=new Image();o.src=d.attr("src");if(!n){n=o.width}if(!j){j=o.height}}var f=d.width()/100,k=d.height()/100,i=d.attr("usemap").replace("#",""),l="coords";a('map[name="'+i+'"]').find("area").each(function(){var r=a(this);if(!r.data(l)){r.data(l,r.attr(l))}var q=r.data(l).split(","),p=new Array(q.length);for(var h=0;h<p.length;++h){if(h%2===0){p[h]=parseInt(((q[h]/n)*100)*f)}else{p[h]=parseInt(((q[h]/j)*100)*k)}}r.attr(l,p.toString())})}).attr("src",d.attr("src"))})};a(window).resize(b).trigger("resize");return this}})(jQuery);
    
    $(document).ready(function(e) {$('img[usemap]').rwdImageMaps();});

    I’ve never formatted js myself before so I hope it all looks alright? It visually has worked, the layout as it should be. I’m still having trouble with the original problem that necessitated me to add custom js; that is I was adding the image map (the coordinates are not responsive) but I’ll take that query over to the developers there now (see earlier link).

    I’ve been researching plugins for image maps for some time and the only solution I’ve found that is usable and allows more than 1 map are paid, and quite expensive too. With this js/css plugin and some cheap image map software I hope to get this working!

    Thank you so much for your support Diana!

    Plugin Author Diana Burduja

    (@diana_burduja)

    Adding the rwdImageMaps function (the first row) is all right.

    There is one last thing for the second row: you’ll need to change the first “$” sign with “jQuery”, as follows:

    jQuery(document).ready(function($) { $('img[usemap]').rwdImageMaps();});

    I know that the example on the rwdImageMaps documentation page has “$” sign, but WordPress loads the jQuery library in noConflict mode, therefore the need for the change. See this article for more details.

    Thread Starter Matt Phillips

    (@matsp)

    Diana, I can’t thank you enough, you’re a star! After your input, it is all working, hotspots too ??

    Seriously a massive help, I’d probably have had to abandon the image maps without you, my sincere thanks.

    Plugin Author Diana Burduja

    (@diana_burduja)

    You’re welcome ??

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘jQuery commented out?’ is closed to new replies.