SirBT
SirBT

Reputation: 1698

How do I stop the two jquery libraries from conflicting with each other?

My page, that contains a couple of slides functioned perfectly with just js/jquery-1.5.2.min.js.

I recently introduced a top banner to my webpage (www.ug-mart.com) with googles CDN , but the top banner didnt work. I have had to remove js/jquery-1.5.2.min.js for the top banner to work.

Having removed js/jquery-1.5.2.min.js everything that initially worked well now doesn't work. Only the top banner works. It seems like i cant have both and js/jquery-1.5.2.min.js on the same page.

Is there a way to stop the the two jquery libraries from conflicting, and collaborate?

Looking forward to your reply.

SirBT

Upvotes: 0

Views: 3571

Answers (5)

Thisismint
Thisismint

Reputation: 188

the simple answer. add this at the end of your scripts.

<script src=""></script>
<script src=""></script>

<script type="text/javascript">
$.noConflict(true);
</script>

Upvotes: 0

Joseph
Joseph

Reputation: 119847

you can safely use jQuery along with other libraries using .noConflict(). usually, it's a conflict of the use of the $ function name.

i prefer doing jquery in the "closure" method:

(function($){

    //i can use "$" safely in here

}(jQuery));

also, if you are using multiple versions of jQuery, then don't. just download the latest and use it. it should still cater some of the old API.


heres a sample code to show how this works:

//lets hijack the "$"
$ = (function() {
    return {
        libName: "some other library using $"
    }
}());

//create a closure for us to use "$"
(function($) {

    //we can now use the $ safely in this closure  
    $('body').text('hello world! in the body!');

    //let's check "$" in here
    console.log('in here, "$" is jQuery:',$);

}(jQuery));

//let's check "$" out here
console.log('out here, "$" is:', $);​

Upvotes: 2

Prashant Singh
Prashant Singh

Reputation: 3793

Replace any one of them as specified:- Declare in any one of them

$a = jQuery.noConflict();

Replace all $ of that file by $a in that file

Upvotes: 1

Francis Chen
Francis Chen

Reputation: 35

Does $.noConflict() works? Import the js/jquery-1.5.2.min.js first and use $.noConflict() to register js/jquery-1.5.2.min.js. Then use another code block and import another version of jQuery. In the end, rewrite the top banner using jQuery.xxx() instead of $.xxx()

I think this should be work.

Upvotes: 1

SpYk3HH
SpYk3HH

Reputation: 22570

See jQuery's $.noConflict()

Although, you'd really be better off, reestablishing whatever plugin requires older jQuery and make use of new version only.

Upvotes: 2

Related Questions