Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to resolve two jquery conflict?

I have a page which includes jquery for curtain effects and other for slider.the problem i am facing is my both jqueries are not working together.what should i do?

my sample code is

    <!-- for slider -->
<script src="images/jquery-latest.js" type="text/javascript"></script>
<script src="images/jquery.bxslider2.min.js" type="text/javascript"></script>
<script src="images/scripts.js" type="text/javascript"></script>

    <!-- for curtain -->
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script src="js/jquery.easing.1.3.js" type="text/javascript"></script>  
like image 311
Vivek Parikh Avatar asked Jun 11 '12 10:06

Vivek Parikh


3 Answers

First of all, try using the current jQuery version (1.7.2) and see if both scripts work.

If not, consider using something that is compatible with the current jQuery version - if something requires jquery 1.3 it wasn't updated for a long time.

If you really need both scripts and both requires different jQuery versions, then you'll need to do it like this:

<script src=".../jquery-1.3.2.js"></script>
<script src="script-that-needs-132.js"></script>
<script>var jQuery132 = $.noConflict(true);</script>
<script src=".../jquery-1.7.2.js"></script>

To use the old jQuery, then wrap the code, using it, like this:

(function($){
    // here $ points to the old jQuery
})(jQuery132);
like image 89
ThiefMaster Avatar answered Oct 03 '22 05:10

ThiefMaster


Remove one of them, preferably this one <script type="text/javascript" src="js/jquery-1.3.2.js"></script>

like image 27
slash197 Avatar answered Oct 03 '22 07:10

slash197


You can use

 <script type="text/javascript" language="javascript">
    var jq = jQuery.noConflict();
</script>
like image 35
Sunny Avatar answered Oct 03 '22 07:10

Sunny