Running two different jQuery functions

Question

I'm trying to run two different scripts, but only one will work at a time. If Code 1 and 2 are on the same page only one works. How can I make them work on the same page?

Code 1

<script src="lib/jquery-1.5.2.min.js"></script>
<script src="lib/jquery.peelback.js"></script>  
<script>
$(function() {
  $('body').peelback({
    adImage  : 'images/peel-ad.png',
    peelImage  : 'images/peel-image.png',
    clickURL : 'http://www.thebestdinosaur.com/',
    smallSize: 150,
    bigSize: 500,
    gaTrack  : true,
    gaLabel  : '#1 Stegosaurus',
    autoAnimate: true
  });
});
</script>

Code 2

<script src="lib/jquery.min.js" type="text/javascript"></script>
<script src="lib/jquery.nivo.slider.pack.js" type="text/javascript"></script>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>

Read about api.jquery.com/jQuery.noConflict if you really have to use two different versions. See also Can I use multiple versions of jQuery on the same page? — Felix Kling
– Felix Kling, Commented Mar 19, 2014 at 3:12

Felix · Accepted Answer · 2014-03-19 03:19:12Z

1

You can use jQuery.noconflict, so replace your first code with:

<script src="lib/jquery-1.5.2.min.js"></script>
<script src="lib/jquery.peelback.js"></script>  
<script>
var jq152 = jQuery.noConflict(true);
jq152(function($) {
    $('body').peelback({
        adImage: 'images/peel-ad.png',
        peelImage: 'images/peel-image.png',
        clickURL: 'http://www.thebestdinosaur.com/',
        smallSize: 150,
        bigSize: 500,
        gaTrack: true,
        gaLabel: '#1 Stegosaurus',
        autoAnimate: true
    });
});
</script>

edited Mar 19, 2014 at 3:19

answered Mar 19, 2014 at 3:14

Felix

38.2k8 gold badges45 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Felix Kling Over a year ago

You removed the the ready callback (intentionally?). Just do jq152(function($) { ... });.

user196815 Over a year ago

Felix, your code works perfect in IE, but in Firefox only the nivo.slider works. Any ideas? View wjfd.org

Felix Over a year ago

@user196815 Not sure why but your site works perfect for me in Firefox and Chrome. Try to clear your browser cache.

Collectives™ on Stack Overflow

Running two different jQuery functions

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related