Javascript slideshow bug (Scriptaculous based)

Question

Dans le code du diaporama ci-dessous, il y a une fonction pour appuyer sur les liens "précédent" et "suivant". Le "suivant" fonctionne bien, et si vous continuez à le presser, il fait défiler toutes les diapositives.

Le "précédent" est un peu en désordre, pour une raison quelconque - il va revenir en arrière une ou deux diapositives mais alors il va juste devenir vide!

Pourriez-vous m'aider s'il vous plaît? Merci!

<script type="text/javascript"> 
    start_slideshow(1, 3, 3000); 

    var currentSlide = 1; 

    function start_slideshow(start_frame, end_frame, delay) { 
     id = setTimeout(switch_slides(start_frame,start_frame,end_frame, delay), delay); 
    } 

    function switch_slides(frame, start_frame, end_frame, delay) { 

     return (function() { 

      Effect.Fade('slide' + frame, { duration: 1.0 }); 

      if (frame == end_frame) { 
       frame = start_frame; 
       currentSlide = frame; 
      } else { 
       frame = frame + 1; 
       currentSlide = frame; 
      } 

      Effect.Appear('slide' + frame, { duration: 1.0 }); 

      if (delay == 1000) { 
       delay = 3000; 
      } 

      id = setTimeout(switch_slides(frame, start_frame, end_frame, delay), delay); 
     }) 
    } 

    function stop_slideshow() { 
     clearTimeout(id); 
    } 

    function next_slide() { 

     clearTimeout(id); 

     Effect.Fade('slide' + currentSlide, { duration: 1.0 }); 

     if (currentSlide == 4) { 
      currentSlide = 0; 
     } 

     currentSlide = currentSlide + 1; 
     Effect.Appear('slide' + currentSlide, { duration: 1.0 }); 
     id = setTimeout(switch_slides(currentSlide, currentSlide, currentSlide, delay), delay); 
    } 

    function previous_slide() { 

     clearTimeout(id); 

     if (currentSlide == 0) { 
      currentSlide = 1; 
     } else { 
      Effect.Fade('slide' + currentSlide, { duration: 1.0 }); 

      currentSlide = currentSlide - 1; 
      Effect.Appear('slide' + currentSlide, { duration: 1.0 }); 
      id = setTimeout(switch_slides(currentSlide, currentSlide, currentSlide, delay), delay); 
     } 
    } 

</script> 

Answer 1

J'ai rencontré un problème comme celui-ci, ou similaire à ceci. Je suppose que vous cliquez rapidement sur le bouton précédent ou suivant avant que l'effet actuellement mis en file d'attente soit terminé. Cela provoquera une erreur avec les effets résultant en un élément donné ayant plus d'un affect qui lui est appliqué en même temps. Pour corriger cela, scriptaculous nous donne la possibilité de mettre en file d'attente les effets dans l'ordre. Référence les documents ici: http://wiki.github.com/madrobby/scriptaculous/effect-queues

Essentiellement, vous devez ajouter une portée à vos effets. Ainsi, après avoir ajouté votre durée, vous devez ajouter une étendue de file d'attente.

Exemple:

Effect.Fade('slide' + currentSlide, { duration: 1.0, queue: { scope: 'slide_show' } }); 

Cela nous permet d'annuler quoi que ce soit dans la file d'attente lorsqu'une touche est enfoncée.

var queue = Effect.Queues.get('slide_show'); 
queue.each(function(effect) { effect.cancel(); }); 

Ceci corrigera peut-être votre suppression ... mais peut-être pas. Quoi qu'il en soit, ces méthodes doivent être utilisées dans votre diaporama;)

Retournez si cela ne résout pas, et je vais faire un peu plus de dépannage.