Jssor Slider: how to run with another jquery version on the same page

Question

I am running Jquery version jquery-1.7.2.min.js because I am using CssGrid to make the site responsive.

I'd also like to use the Jssor Slider, which uses the newer version of jquery-1.9.1.min.js.

I tried using the noConflict Jquery, but am not sure how to encase the rest of the code, so that it doesn't conflict.

    <!-- load jQuery 1.9.1 -->
    <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript">
    var jQuery_1_9_1 = $.noConflict(true);
    </script>
    <script type="text/javascript" src="js/jssor.core.js"></script>
    <script type="text/javascript" src="js/jssor.utils.js"></script>
    <script type="text/javascript" src="js/jssor.slider.js"></script>

I'm assuming I have to change the wording of the Slider script name, but am unsure how to rename/code it.

    jQuery(document).ready(function ($) {

Cleaned up code of site without CSS JFiddle.

So can someone point me in the right direction on how to change the code to make both versions run correctly with using the noConflict for Jquery? If I'm not mistaken I can just modify the one for Jssor Slider and then leave the older 1.7.2 alone and it will default to that version?

Edit: Weirdly enough the responsive grid needs the jquery at the bottom of the page (and does seem to work with the newer version of Jquery), whereas the Jssor Slider needs it at the top? Odd, but I'll work around it.. Sorry for the wasting of space!

Answer 1

you are very lucky that jssor slider works with any jquery version.

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jssor.core.js"></script>
<script type="text/javascript" src="js/jssor.utils.js"></script>
<script type="text/javascript" src="js/jssor.slider.js"></script>