Javascript conflicts - two jquery things on one page, only one works

[VisHorizons]

Firstly, I don't know anything about javascript, so I feel lucky that jquery exists. I have a jquery-related slideshow set up on my homepage (the head tag js stuff is in the Storefront Page template). I'm trying to add a little newsletter sign-up jquery thing to the category tree header (head tag js is in "HEAD Tag Content/CSS"), but it won't work. It works on pages that don't use the slideshow js.

For now, I've hidden the button down low on the left column after the social media buttons. The home page and this page have the slide show code. But the sign up feature works on all other pages.

How do I get two js things to work on one page, when one of them is unique to the page and the other is universal on all pages?

Thanks for any help!

[Dan - Glendale Designs]

Re: Javascript conflicts - two jquery things on one page, only one works

It looks like there are two versions of jQuery being called in, which could very well be the issue depending on the plugins/solutions you are trying to use. It is also important to watch the load order of the jQuery library in conjunction with any functions, as well as the load order of functions with elements. (some plugins require the function to be called after any associated elements, others do not)

[Brandon MUS]

Re: Javascript conflicts - two jquery things on one page, only one works

You'll probably want to use noConflict ( http://api.jquery.com/jQuery.noConflict/ ) or look at your requirements and select just one version of jQuery.

[Bruce - PhosphorMedia]

Re: Javascript conflicts - two jquery things on one page, only one works

...and make sure any onload features are prefixed with 'document.ready'....

[VisHorizons]

Re: Javascript conflicts - two jquery things on one page, only one works

Thanks for your help. Honestly, javascript terrifies me. I removed the jquery link from the Storefront Page template and linked up jquery migrate to allow the older function to work. After a lot of trial and error. But I got there, thanks to your help!

This is possibly an unrelated question: my newsletter sign-up php file is built to send the user to a destination after the form is filled out. How can I make it send the user back to whatever page they were on? I coped the php from an online tutorial, and I can figure out how to change the destination page, but I don't know how to set it to "where ever you came from".

[ids]

Re: Javascript conflicts - two jquery things on one page, only one works

Maybe unrelated to this solution, I found that making sure CSS selectors IDs are not repeated on a page. IOW, it may be possible that the repeated ID= may prevent the page from rendering as desired.

Scott