javascript - jQuery: noConflict

Question

I just cannot work this out. My god it's making my brain hurt, so I turn to you, the good people of the internet.

I've been staring at the documentation for the jQuery $.noConflict() function with no luck.

My issue is that the site I'm working on already includes jQuery 1.1.3.1 but I want to do some awesome and snazzy UI work in a few places, so I want to use 1.4.2 for obvious reasons.

I've been trying to run these side by side but I can't seem to get any code to execute. I also need to implement a few plugins using 1.4.2 so I'm not sure if putting jQuery over to something like $j would work, as obviously the plugins would pick up $ and jQuery as 1.1.3.1 rather than 1.4.2.

Is there a way that I can wrap my code in a noConflict() block and also include the plugins that I need to create a self contained block of 1.4.2 code?

Any help would be fantastic as my poor mind weeps amid the vast wasteland that is the API docs!

Answer 1

If you have two or three jQuery in the same page, just put a different variable for each different jQuery.

Example:

<script type="text/javascript">
    var $s = jQuery.noConflict();
    $s(document).ready(function() {
        $s('#news-container').vTicker({
            speed: 500,
            pause: 3000,
            animation: 'fade',
            mousePause: true,
            showItems: 2
        });
    });
</script>
<script type="text/javascript">
    var $j = jQuery.noConflict();
    $j(document).ready(function() {
        $j('.sf-menu ul').superfish({
            delay: 1000,
            animation: {
                opacity: 'show',
                height: 'show'
            },
            speed: 'medium',
            autoArrows: false,
            dropShadows: 'medium'
        });
    });
</script>