Arrêt fonction du cycle jQuery sur vol stationnaire

Question

J'ai une fonction appelée testimonials() que, fondamentalement, cycles par un ensemble de divs, alors qu'il anime un div dans, anime dehors et anime la suivante dans.

Maintenant, je voulais faites-le s'arrêter sur le DIV actuel une fois que la souris est dessus, autrement dit comme le survolant. Et je l'ai fait travailler en utilisant un code que j'ai reçu d'un autre poste sur ce site, je me demandais juste si quelqu'un pouvait me l'expliquer parce que je suis un peu nouveau à jQuery et je veux vraiment comprendre pourquoi cela fonctionne.

Le code est le suivant:

function testimonials() { 
    //function here 
} 

//to stop on hover 

var timerId = null; 

function startRotation() { 
    if (timerId) { 
     return; 
    } 
    timerId = setInterval('testimonials()', 5000); 
} 

function stopRotation() { 
    if (!timerId) { 
     return; 
    } 
    clearInterval(timerId); 
    timerId = null; 
} 

$(function() { 
    startRotation(); 
    $('.testimonials').hover(stopRotation, startRotation); 
}); 

Answer 1

Alors, comment cela fonctionne ... cassons vers le bas morceau par morceau. .hover(func1, func2) est un raccourci pour .mouseenter(func1).mouseleave(func2), ce qui signifie que la première fonction s'exécute lorsque votre souris entre dans l'élément, la seconde quand elle part.

fonction d'abord, lorsque la souris entre:

function stopRotation() { 
    if (!timerId) { 
     return; 
    } 
    clearInterval(timerId); 
    timerId = null; 
} 

Ceci est l'arrêt de l'intervalle défini précédemment par setInterval() de courir plus, tuant la boucle de courant via clearInterval() et de compensation de la variable timerId, de sorte que la fonction startRotation redémarre la boucle quand il est prêt à (sur mouseleave).

fonction En second lieu, lorsque la souris quitte:

function startRotation() { 
    if (timerId) { 
     return; 
    } 
    timerId = setInterval('testimonials()', 5000); 
} 

Cette nouvelle commence la boucle en démarrant une minuterie pour exécuter testimonials() toutes les 5 secondes, mais seulement s'il n'y a pas une minuterie déjà en cours d'exécution (par checkin si timerId est défini). Il le fait via setInterval().

Un changement que je ferais, ne passe jamais une chaîne dans setInterval() ou setTimeout(), cela fonctionne un eval() en interne. Au lieu de cela, appelez directement la référence de la fonction, comme ceci:

timerId = setInterval(testimonials, 5000);