clearTimeout funktioniert nicht in jquery?

Question

Ich versuche Zeit mit jQuery clearTimeout() -Funktion zu löschen, wenn Maus auf das div. Aber Timer wird nicht gestoppt. Hier ist mein Code.

$(document).ready(function(){ 

var timer= setTimeout(function() 
    {display()},3000); 

    $('.movieSlide').hover(function(){ 
     clearTimeout(timer) ; 

    }); 
}); 


function display(){ 
    var container=$('.movieSlide'); 
    var slideDiv=$('.movieSlide').find('.movieReview'); 

    slideDiv.css({"display":"none"}); 

    $(slideDiv[1]).css({"display":"block"}); 

    $(slideDiv[2]).css({"display":"block"}); 

    $(slideDiv[0]).appendTo(container); 

    setTimeout(display,5000); 

    } 

Ich bin mir nicht sicher, warum es nicht funktioniert und auch kein Fehler im Browser. Danke im Voraus.

Answer 1

Sie rufen die Anzeige erneut auf, indem Sie setTimeOut im Anzeigebereich (Endlosschleife) verwenden. Wenn Sie die Maus halten, wird der Timer gestoppt, aber ein anderes separates Display wurde bereits ausgelöst. Sie können stattdessen setInterval verwenden.
Beispiel https://jsfiddle.net/9aLvd3uw/118/