Muhamad Kwexa Muhamad Kwexa - 20 days ago 5
Javascript Question

I can't use multiple jquery versions

I want use two different jquery version on one page it is my codes:

<!----- mobile menu Starts ----->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="style/mobile_menu.css">
<script type="text/javascript">
var jQuery_1_11_0 = $.noConflict(true);
</script>
<!----- mobile menu Ended ----->
<!------ The Post slide starts ------>
<link rel="stylesheet" type="text/css" href="./style/post_slide_style.css">
<script src="js/jquery.v1.5.1.min.js"></script>
<script type="text/javascript">
var jQuery_1_5_1 = $.noConflict(true);
</script>
<script type="text/javascript" src="./js/jquery.colorbox.js"></script>
<script>
jQuery_1_5_1(document).ready(function(){
jQuery_1_5_1("a.gallery").colorbox({rel:'gallery'});
jQuery_1_5_1("a.dbox").colorbox({iframe:true, width:"480", height:"580"});
});
</script>
<!------ The Post slide Ended ------->


The Mobile Menu is work but The Post slide isn't work thanks for helping

Answer

The main problem is that you are passing true to both noConflict calls.

jQuery.noConflict( [removeAll ] )
removeAll
Type: Boolean
A Boolean indicating whether to remove all jQuery variables from the global scope (including jQuery itself).

So after those calls you code has not access to $ nor jQuery so you should be getting some errors in your console.

If you want to use the second version of jquery then remove the true from that noConflict call.


In general, though, it is a bad sign when you must use two versions of jQuery in the same page.