I´m in the process of designing a Joomla based webshop with Virtuemart 2, and I´m having a problem with one of my slider-modules, the "Vinaora Nivo Slider" to be exact, which seems to be caused by a JS conflict..
Here is the problem:
The slider is set to be shown on all pages in Joomla.
It works perfectly on all Virtuemart-pages, e.g. product details page, Category-pages ect., but whenever I´m on a page "outside" the Virtuemart-component the slider breaks its module position, and I find these two errors in Chrome (F12):
Uncaught ReferenceError: jQuery is not defined jquery.nivo.slider.min.js:12
Uncaught TypeError: Object [object Object] has no method 'nivoSlider' http://www.traeogbyg.dk/:2069
There are zero errors or warnings when I´m on a Virtuemart-page, and as explained the slider works perfectly in those cases..
The reason why I seek help in this forum is becuase I think this is a pure JS-conflict. It seems, based on my lack of knowledge, that my website is loading/running two different jQuery library versions or something, and whenever I´m on a page "outside" Virtuemart the jQuery version that is loaded is not compatible with the slider-module..
Here is my questions:
What is the best way to ensure that only one version of the jQuery library (the newest would be preferred, I guess) is loaded on all pages throughout the entire website?
I have tried using different plugins to automatically sort out JS conflicts, but while some actually seemed to work they also slowed down the system dramatically..