ansaurus

Question

jquery conflict - how to use the jQuery.noConflict();

Answer 1

+2 A:

NOTE: This function must be called after including the jQuery javascript file, but before including any other conflicting library, and also before actually that other conflicting library gets used, in case jQuery is included last. noConflict can be called at the end of the jQuery.js file to globally disable the $() jQuery alias.

Just add a script tag to your header after your jquery includes to run the noConflict() function (example taken from the "Using jQuery with noConflict" page):

<head>
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>
   <script>
     jQuery.noConflict();

     // Use jQuery via jQuery(...)
     jQuery(document).ready(function(){
       jQuery("div").hide();
     });

     // Use Prototype with $(...), etc.
     $('someid').hide();
   </script>
 </head>

womp 2010-01-15 04:46:16

Answer 2

A:

<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script>jQuery.noConflict();</script>
<script src="js/jquery.cycle.all.min.js" type="text/javascript"></script>
<script src="js/menu.js" type="text/javascript"></script>
<script src="js/slideshow.js" type="text/javascript"></script>

menu.js:

(function($){
$(document).ready(function () {   

    $('#nav li').hover(  
        function () {  
            //show its submenu  
            $('ul', this).slideDown(100);  
        },   
        function () {  
            //hide its submenu  
            $('ul', this).slideUp(100);           
        }  
    );  

}); 
})(jQuery);

slideshow.js:

(function($){

 $('blah').cycle()
})(jQuery);

meder 2010-01-15 04:49:21

thanks for answering. I did this as indicated and same result. Slideshow works but not menu doesn't. I am assuming that the 'blah' was just because I should understand it by that point in your answer but just want to make sure. What could I be doing wrong?

bgadoci 2010-01-15 05:07:03

can you make a separate question if you have an entirely different issue than the noConflict business? and provide html?

meder 2010-01-15 05:21:35

I tried the same but only one works...

Indranil Mutsuddy 2010-05-15 11:42:54

Answer 3

+1 A:

I can't see why you need jQuery.noConflict() which is to do with other scripts using the $ variable. See the documentation.

Instead, as Ryan says, you need to place your cycle code inside a $(document).ready(), so slideshow.js becomes:

$(document).ready(function () { 
    $('#slideshow').cycle({ 
        speed:      200,
        timeout:    0, 
        pager:      '#tabs', 
        pagerEvent: 'mouseover' 
    });
});

Sam Doshi 2010-01-15 08:47:16

So I did this and still nothing. I now have the slideshow.js as you indicate but only the slide show is working not the menu. What order would you have the scripts listed in the head?

bgadoci 2010-01-15 14:51:44

It shouldn't make any difference what order they are listed in. Try constructing a minimal test page.

Sam Doshi 2010-01-15 16:31:06

ansaurus

tags:

views:

answers:

jquery conflict - how to use the jQuery.noConflict();

related questions