Jquery Problème d'arrêt de la boucle

Question

J'ai reçu ce code jquery. Et c'est une sorte de diaporama avec effet de fondu. Donc, il boucle ... c'est le premier code

$(document).ready(function(){ 
    function looptour(){ 
     $("#health").hide(); 
     $("#billing").hide(); 
     $("#pension").delay(6000).fadeOut(2000); 
     $("#health").delay(6000).fadeIn(2000).delay(6000).fadeOut(2000); 
     $("#billing").delay(14000).fadeIn(2000).delay(6000).fadeOut(2000); 
     $("#pension").delay(14000).fadeIn(2000,looptour); 
    } 
    looptour(); 
}); 

Mon problème est comment arrêter la boucle que vous avez vu sur le premier événement onclick de code? Ensuite, après avoir cliqué sur cet événement une nouvelle boucle se déroulera et ainsi de suite ...

Voici le nouveau code,

$("#tournums").click(function(){ 
    function billingloop(){ 
     $("#health").hide(); 
     $("#pension").hide(); 
     $("#billing").delay(6000).fadeOut(2000); 
     $("#pension").delay(6000).fadeIn(2000).delay(6000).fadeOut(2000); 
     $("#health").delay(14000).fadeIn(2000).delay(6000).fadeOut(2000); 
     $("#billing").delay(14000).fadeIn(2000,looptour); 
    } 
    billingloop(); 
}); 

Merci beaucoup maîtres jquery pour me aider avec ce problème à moi.

Answer 1

Ma meilleure estimation est d'utiliser .clearQueue() pour cela:

function stopLoop() { 
    $("#pension").clearQueue(); 
    $("#health").clearQueue(); 
    $("#billing").clearQueue(); 
} 

// snip // 

$("#tournums").click(function(){ 
    stopLoop(); 

    function billingloop(){ 
     $("#health").hide(); 
     $("#pension").hide(); 
     $("#billing").delay(6000).fadeOut(2000); 
     $("#pension").delay(6000).fadeIn(2000).delay(6000).fadeOut(2000); 
     $("#health").delay(14000).fadeIn(2000).delay(6000).fadeOut(2000); 
     $("#billing").delay(14000).fadeIn(2000,looptour); 
    } 
    billingloop(); 
});