Page 1 of 1

Conflict JQuery script and CGGoogle2

Posted: Wed Dec 21, 2016 11:41 am
by musicscore
When I use CGGooglemap2 and a JQuery script on the same page, my JQuery script is not working.
Removing the CGGooglemaps2 tag and the JQuery script is working.

check at2.dev-infowebs.nl and hover over the images in News. They should zoom.

I tested with :

Internet Explorer : Not working
Google Chrome : Only working after Ctrl-F5. Not working after F5
Safari : Working

What can I do to make the JQuery script and CGGooglemap2 work in al browser correct.

Please help

Re: Conflict JQuery script and CGGoogle2

Posted: Wed Dec 21, 2016 11:51 am
by Rolf
Just working on it at https://www.zeijen.nu/bezienswaardigheden

Code: Select all

< script src="//code.jquery.com/jquery-latest.min.js" type="text/javascript"></ script>
< script src="/lib/jquery/js/jquery-ui-1.10.4.custom.min.js" type="text/javascript"></ script>
Needs to be added in the HEAD area of the template, and not in the bottom of the template.

Re: Conflict JQuery script and CGGoogle2

Posted: Wed Dec 21, 2016 12:42 pm
by musicscore
Added your code as a replacement of the {cms_jquery} tag but without succes. The problem stays.

Looks like cggooglemaps2 adds the jquery module extra and destroying the working of the other Jquery plugin

Re: Conflict JQuery script and CGGoogle2

Posted: Wed Dec 21, 2016 12:45 pm
by Rolf
Link to the site?

Re: Conflict JQuery script and CGGoogle2

Posted: Wed Dec 21, 2016 1:37 pm
by musicscore
Is in my first post :

http://at2.dev-infowebs.nl

Re: Conflict JQuery script and CGGoogle2

Posted: Wed Dec 21, 2016 2:55 pm
by musicscore
Just discoverd.

When I add the cggooglemap2 tag before the jquery script, the script is working

Code: Select all

{CGGooglemap2}
<a class="zoomhover" href="#"><img src="uploads/images/thumbnail-1.jpg" alt="thumbnail" /></a>
When I add the cggooglemap2 after the script, the script is not working

Code: Select all

<a class="zoomhover" href="#"><img src="uploads/images/thumbnail-1.jpg" alt="thumbnail" /></a>
{CGGooglemap2}
Please help. Why is this happening ?

Re: Conflict JQuery script and CGGoogle2

Posted: Wed Dec 21, 2016 4:42 pm
by velden
Can you explain what is not working exactly?

Code: Select all

<a class="zoomhover" href="#"><img src="uploads/images/thumbnail-1.jpg" alt="thumbnail" /></a>
This is not a (jQuery) script.

Re: Conflict JQuery script and CGGoogle2

Posted: Thu Dec 22, 2016 11:21 am
by musicscore
Velden,

Sorry, you right. My question is not complete.

I have this script in the head section of my template :

Code: Select all

<__script__ src="/scripts/hover.zoom.js"></__script>
<__script__>
    $(function() {
          $('.zoomhover').hoverZoom(); // Default
          $('#green').hoverZoom({
                overlayColor: '#90bd2e',
                zoom: 50
          });
    }); 
</__script>
In the attachment attached to my first message you find the jquery script.

If you want I can give you access to my test environment you can test en see what happens.

If you look here : http://v1122.dev-infowebs.nl you can see the script is working because I put the html code

Code: Select all

<a class="zoomhover" href="#"><img src="uploads/images/thumbnail-1.jpg" alt="thumbnail" /></a>
AFTER the cggooglemap2 module.
When I switch, so first the html code and then cggooglemap2, the jQuery script does not work anymore.

[Solved]: Conflict JQuery script and CGGoogle2

Posted: Sat Dec 24, 2016 12:07 pm
by musicscore
I created my own JQuery script and now it's working. Looks like the problem was in the downloaded script.

Thanks for you answers and help.

Re: Conflict JQuery script and CGGoogle2

Posted: Wed Jan 04, 2017 9:04 pm
by johnflan
Just been suffering from this problem so picked up on the adding of {cms_jquery} into the head. It worked in a minimal template so guessed the .js in the footer must be interferring. Had a wodge of it so tried deleting line by line. Found that deleting <__script__ src="https://ajax.googleapis.com/ajax/libs/j ... "></__script> worked and the gallery, scroll to top, menus etc still work. Brilliant. Perhaps I should find out what the rest of the .js does!