Problème avec les boucles retardées

Question

Je fais un cauchemar en essayant d'obtenir des guillemets avec un retard. J'ai créé le code suivant:

function loopquotes(){ 
var items = $('.comment').size(); 
var randomNum = Math.floor(Math.random()*items+1); 
$(".comment:nth-child("+randomNum+")").fadeIn('slow').delay(5000); 
$(".comment:nth-child("+randomNum+")").fadeOut('medium'); 
} 

Cela se fane et joliment avec le retard. Cependant, la boucle continue à boucler sans utiliser le délai et je me retrouve avec beaucoup de citations sur la page. Quelqu'un peut-il m'aider à boucler correctement ceci afin qu'une nouvelle citation soit seulement chargée après que l'ancienne a disparu.

Un grand merci

David

Answer 1

Vous pouvez appeler à nouveau la fonction comme un rappel, comme ceci:

function LoopQuotes(){ 
    var comments = $('.comment'), 
     rand = Math.floor(Math.random()*comments.length+1); 
    comments.eq(rand).fadeIn('slow').delay(5000).fadeOut('medium', LoopQuotes); 
} 

Puis vient d'appeler cette fois sur la charge de page, par exemple avec un appel, comme document.ready ceci:

$(LoopQuotes); 

Ce que cela fait est fondu dans une citation, 5000ms de retard, fade out, puis lorsque le .fadeOut() terminé, appeler à nouveau la fonction de choisir/montrer la citation suivante.