Hana90
Hana90

Reputation: 925

Different jQuery sources & versions in same page (googleapi, Code)

I have to pages, first for sortable list (li), which used the following Javascripts:

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>

The second page for mmenu which have the following jquery:

<script type="text/javascript" src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="/theme/mmenu/dist/jquery.mmenu.all.js"></script>

When I want to add both scripts into a single page( where menu and sortable are working), there are some errors appear since when I remove Jquerys of sortable then the mmnue will work, and when I remove Jquery of sortable then mmenu won't work!

So please how to get both of them work on a single page?

Upvotes: 0

Views: 34

Answers (1)

Husman
Husman

Reputation: 6909

This is possible using jQuery.noConflict()

Something like:

<script src='jquery-1.3.2.js'></script>
<script>
var jq132 = jQuery.noConflict();
</script>
<script src='jquery-1.4.2.js'></script>
<script>
var jq142 = jQuery.noConflict();
</script>

See this for more examples: http://blog.nemikor.com/2009/10/03/using-multiple-versions-of-jquery/

Upvotes: 2

Related Questions