2011-06-25 3 views
0

Je travaille sur une page HTML et je veux utiliser jQuery pour mon diaporama et une image pop-up (jQuery-lightbox) sur une même page. Cependant, quand je actif ces deux fonctions en même temps, la fonction d'image pop-out fonctionne, mais la section slide-show a cessé de fonctionner. Peut-être que je l'ai écrit la fonction d'une manière erronée ....Deux fonctions jQuery différentes dans le même HTML

Je vous remercie de votre aide!

Voici mon code:

<head> 
<!--slideshow--> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
<script src="nivo-slider/jquery.nivo.slider.pack.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(window).load(function() { 
     $('#slider').nivoSlider({ 

     effect:'random', 

    }); 
}); 
</script> 

<!--Lighbox-popout--> 
<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script> 
<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" /> 
<script type="text/javascript"> 
    $(function() { 
     $('#photo a').lightBox(); 
}); 
</script> 
</head> 

Répondre

2

vous chargez deux versions différentes de jquery qui interfèrent les uns avec les autres. se débarrasser de cette ligne:

<script type="text/javascript" src="js/jquery.js"></script> 

et voir si cela aide.

1

Ne pas utiliser window.load utilisation $(function() { ... }). En outre, le DOM n'est pas prêt lorsque vous appelez pour lightbox.

1

Vous avez inclus 2 versions de jQuery il semble, désactiver l'un ou l'autre et voir si cela fonctionnera alors.

Également, perdez la virgule de fin dans la ligne effect:'random',, certains navigateur s'étoufferont sur cela.

1

Utilisez cette

<head> 
<!--slideshow--> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
<script src="nivo-slider/jquery.nivo.slider.pack.js" type="text/javascript"></script> 
<!--Lighbox-popout--> 
<script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script> 
<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" /> 
<script type="text/javascript"> 
    $(function() { 
     $('#photo a').lightBox(); 
       $('#slider').nivoSlider({effect:'random'}); 
}); 
</script> 
</head> 
Questions connexes