CODEWITHSUNDEEP
javascriptjqueryhtmllightboxconflict
Christi Du Toit
Christi Du Toit

Reputation: 1

Javascript Lightbox 2 Issue

I'm quite new at this, so please be thorough with the explanation. I'm using the Lightbox 2 jQuery file, along with another jQuery file to execute a menu slide animation and a fade animation on my images. I'm assuming that there is conflict between the two jQuery files, but I'm not sure how to resolve it.

Any advice? I read something about jQuery.noConflict(), but I'm not sure how to implement it, or it if will work. 

<script src="../Scripts/jquery-2.0.2.min.js" type="text/javascript"></script>
<script type="text/javascript">

$(document).ready(function() {
    $('div#ScrollBox img').animate({
        opacity:.5
    });
    $('div#ScrollBox img').hover(function(){
    $(this).stop().animate({opacity:1}, 'fast');
    }, function(){
        $(this).stop().animate({opacity:.5}, 'slow');
    });
});

</script>

<!--LIGHTBOX-->
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/lightbox-2.6.min.js"></script>
<link href="css/lightbox.css" rel="stylesheet" />

Upvotes: 0

Views: 1209

Answers (2)

Dan
Dan

Reputation: 158

It looks like you are loading two different jQuery versions (1.10.2 and 2.0.2), which is, I believe, causing the problem. I would recommend removing the 1.10.2 jQuery script, and one of the following (in order of effort, in case you want to try all 3): -see if your lightbox plugin still works -find a newer version of the same lightbox -use a different lightbox, for example fancybox

In any case, make sure that your end result only has one version of jQuery being loaded.

Upvotes: 1

A-Train
A-Train

Reputation: 51

Is there a reason you need both? They should have pretty much the same code so you only need to include one. I would use whichever is the latest.

It would help if you included in your post the lines of code where you explicitly add them so we can see what you are doing.

Upvotes: 0

Related Questions