JQuery conflict with an other JQuery library

conflict, jquery, slider

Solution

What you need to do to fix your problem is un-alias the jQuery function and assign it to another variable name (remember: variables can be functions). You need to use the `jQuery.noConflict()` function to un-alias the `$()` function. Here one one to do it:

// ...after all of Joomla's JS is done executing...

// before loading your version of jQuery var jquery = {}; // aka new Object()
jquery.joomla = jQuery.noConflict(); // moves jQuery into another namespace

// load your version

Now, when you load your version, it will take over the jQuery and `$` namespaces, but you'll still have the other reference to Joomla's jQuery function if you need it. To re-iterate, the basic flow is:

- Load Joomla's jQuery

- Run Joomla's jQuery-dependent code

- Move Joomla jQuery into another namespace

- Load your jQuery

- Execute your code using `$()`

Problem

I use jquery for a module. My joomla template have an integrated jquery menu. So they conflict with each other. Is there a way to solve this problem. Following the script code of the module ``` <script type="text/javascript" charset="utf-8"> window.onload = function () { var container = jQuery('div.sliderGallery'); var ul = jQuery('ul', container); var itemsWidth = ul.innerWidth() - container.outerWidth(); jQuery('.slider', container).slider({ min: 0, max: itemsWidth, handle: '.handle', stop: function (event, ui) { ul.animate({'left' : ui.value * -1},340); }, slide: function (event, ui) { ul.css('left', ui.value * -1); } }); }; </script> ```

Original source