Reputation: 524
I am trying to setup a way to use multiple version of jquery. I am currently trying to make a old site responsive using bootstrap and need the newest version of jquery but the site has a couple sliders on it that use an older version of jquery and they new version breaks them. I have done some research and believe that I am close but just not sure what I am not doing right. How do you setup this up so that I can tell jquery to only use the old version for the plugin, the code for the silder plugin is massive and I don't want to change "$" 784 times through the code.
Here is my current setup. I am using a CMS and these are nested within different controls.
Control that generates javascript on the page:
<script type="text/javascript" src="//ajax.googleapis.com/ajax/lib/jquery/1.8.1/jquery.min.js"></script>
<script>var jq181 = jQuery.noConflict(true);</script>
<script type="text/javascript" src="JavaScript/jqueryui.js"></script>
<script type="text/javascript" src="JavaScript/jquery-custom.js"></script>
<script type="text/javascript" src="JavaScript/simple-expand.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
Here is my jquery file I placed it here because it was somewhat large: http://pastebin.com/ej8AKPHy
I think I can use this code to achieve what I want to do I am just not sure how to setup it up or what code needs to go inside it.
var jq181 = jQuery.noConflict(true);
(function ($) {
$(document).ready(function () {
});
}(jq181));
So does the entire jquery file need to go inside this function or just parts?
Upvotes: 0
Views: 179
Reputation: 388316
One possible option for you instead of using multiple version of jQuery is to try out the migration plugin.
The problem you could be facing is some of the plugins might be using methods that are removed in jQuery 1.9 when a lot of deprecated was cleaned up. To enable backward compatibility jQuery has introduced the migration plugin which will restore those removed functionality. So try it out
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.js"></script>
<script type="text/javascript" src="JavaScript/jqueryui.js"></script>
<script type="text/javascript" src="JavaScript/jquery-custom.js"></script>
<script type="text/javascript" src="JavaScript/simple-expand.js"></script>
Upvotes: 1