Reply To: Jquery conflict

#9762

Ernest Marcinko
Keymaster

Hi!

In addition to my previous answers, I have forgot to mention that it is possible to change the script scope on the Compatibility Settings submenu: https://i.imgur.com/YiL7azr.png
I suggest using the “minified scoped” option if you are planning to experiment with different jQuery versions. In this case the plugin loads a bit of extra code, and mimics an own jQuery scope separated from the one loaded by wordpress – thus it gets completely separated from dependencies.

However changing the jQuery versions is not the best idea, as every plugin developer makes their plugins to be compatible with scripts used by the wordpress core. In your case the problem was caused by this scenario:

– On the top of the page there was a manual jQuery loading separate from the core
– Then your scripts followed, which were executed right after the custom jQuery load
– Then the wordpress core jQuery was loaded, because ajax search pro was activated. It was not the plugins fault, any other plugin requesting jQuery would triggered the same behavior. And most plugins do use jQuery.

The problem here is that the first jQuery loaded up to variable scopes “$” and “jQuery”. Then the second, core load overwrites that, but for some reason only the “$” variable scope. Now the first jQuery is within the “jQuery” scope, the second in “$”. However plugins tend to use the “jQuery” scope and the “$” as an alias to that same scope. So using the “$” variable in your scripts however was not an alias to the original scope, but a different object.

This is one of the main reasons not to do that, unless you have a very good understanding of variable scopes and jQuery itself. Another reason is compatibility. New plugin versions will come out one after another and all of them is created to the jQuery within the wordpress core. Therefore there is a very high chance of plugin updates breaking everything.

I hope you don't mind I share this information with you. I've done a good amount of experimenting with these, and I also did replace core jQuery and done similar stuff, but it all lead to more and more issues. I did use the velocity script as well, but eventually dropped it, as it was unnecessary once I understood how to use pure CSS3 animations instead. Still a solid choice if you use lots of separate animations at once.

Best,
Ernest Marcinko

If you like my products, don't forget to rate them on codecanyon :)