jQuery problème de pagination diaporama

Question

Je suis un newb jQuery et j'ai essayé de créer un widget diaporama personnalisé pour une page que je suis en train de développer. J'ai été capable de faire fonctionner tous les bits de base (lecture automatique, pause, légendes) mais j'ai rencontré un blocage avec la pagination (vous permet de choisir la diapositive). Pour une raison quelconque, une fois que j'essaie de sélectionner une diapositive, l'image et les légendes disparaissent. Aucune erreur n'est levée, il refuse simplement de changer l'image ou la légende. Heres' le code:

Ce morceau de code démarre le diaporama et les contrôles qu'il

$(document).ready(function() { 
    var speed = 2000;        
    var state = 1;           

     $('#gallery li, #caption li').css('position','absolute');   

     $('#gallery li:first, #caption li:first').addClass('visible');    

     var timer = setInterval('autoSlideshow(-1)', speed);    

    $('#controls a.playpause').toggle(
     function() { 
      $(this).css('background-image','url(images/play.png)'); 
      clearInterval(timer); 
      state = 0; 
      return false; 
     }, 
     function() {   
      $(this).css('background-image','url(images/pause.png)'); 
      timer = setInterval('autoSlideshow(-1)', speed); 
      state = 1; 
      return false; 
     } 
    );   

    $('#controls a.pagination').click(function(){ 
     var slide = $(this).index(); 

     slide-=1; 
     clearInterval(timer); 
     timer = setInterval(function(){autoSlideshow(slide);}, speed); 


    }); 


    $('#gallery, #caption').hover(        
     function() { 
      if(state == 1) 
       clearInterval(timer); 
     }, 
     function() { 
      if (state == 1) 
       timer = setInterval('autoSlideshow(-1)', speed); 
     } 
    ); 


}); 

Ce bit fait la décoloration dans et hors des diapositives

function autoSlideshow(mode) { 
    var currentImage = $('#gallery li.visible');         
    var currentCaption = $('#caption li.visible'); 

    if(mode == -1){ 
     var nextImage = currentImage.next().length ? currentImage.next() :   
        currentImage.siblings(':first');   
     var nextCaption = currentCaption.next().length ? currentCaption.next() :   //Determine the next slide 
        currentCaption.siblings(':first'); 
    } 
    else{ 
     var nextImage = $('#gallery li:eq(mode)'); //I'm pretty sure these two lines are the problem 
     var nextCaption = $('#caption li:eq(mode)'); // 
    } 

    currentImage.fadeOut(250).removeClass('visible'); 
    nextImage.fadeIn(250).addClass('visible'); 
    currentCaption.fadeOut(250).removeClass('visible'); 
    nextCaption.fadeIn(250).addClass('visible'); 


} 

Toute aide vous les gars pourriez donner serait apprécié.

Mo

Answer 1

chaîne constante vs variables .... essayez ceci:

var nextImage = $('#gallery li:eq('+mode+')'); 
    var nextCaption = $('#caption li:eq('+mode+')'); 

Cela devrait en mode convertir en une chaîne ainsi eq obtiendra un nombre au lieu du mot "mode".

(NB: Je viens de regarder la ligne mise en surbrillance, je n'ai pas vérifié ou tester le reste du programme, il peut y avoir d'autres problèmes.)

modifier pour répondre à la question ci-dessous

Vous regardez juste de côté. Rappelez-vous que 'bla bla bla' est une chaîne de caractères constante. Ce n'est pas évalué. Il reste statique et ne change pas.

Une autre façon de voir cela est de se souvenir de la différence entre le compilateur et la fonction jQuery. Prenez la chaîne '#caption li:eq(' en ajoutant la valeur de la variable (conversion implicite), puis ajoutez la constante de chaîne ')' à la fonction jQuery.

Ainsi la fonction jQuery sera appelé avec le paramètre de chaîne suivante (si le mode a la valeur 9):

'#caption li:eq(9)'

Dans votre code jQuery a été appelé avec le paramètre de chaîne suivante

'#caption li:eq(mode)'

Est-ce que cela est clair?