Diashow muss nach der Verwendung der Navigationstasten angehalten werden

Question

Ich möchte, dass meine Diashow-Navigationstasten zwischen Bildern wechseln, auf diesem Bild pausieren und dann die Diashow fortsetzen. Derzeit ändert sich das Bild, wenn der Benutzer klickt. Abhängig davon, wann dieses Ereignis eintritt, überspringt die Diashow Bilder oder zeigt zwei schnell. Ich bin mir nicht sicher, wie ich die Pause erstellen soll, bevor die Diashow fortgesetzt wird. Mein Code sieht derzeit so aus:

<script type="text/javascript" language="JavaScript"> 
    var step = 0; 
    function slideIt(){ 
     if(!document.images) return; 
      document.getElementById('slide').src = slideshow[step].src; 
       if (step < 3){ 
        step++; 
       } 
       else{ 
        step = 0; 
       } 
      setTimeout('slideIt()', 3500); 
    } 
    function previousImg(){ 
     if(!document.getElementById) return; 
      document.getElementById('slide').src = slideshow[step].src; 
       if (step > 0){ 
        step--; 
       } 
       else{ 
        step = 3; 
       } 
    } 
    function nextImg(){ 
     if(!document.getElementById) return; 
      document.getElementById('slide').src = slideshow[step].src; 
       if (step < 3){ 
        step++; 
       } 
       else{ 
        step = 0; 
       } 
    } 
    slideIt(); 
</script> 

Wieder möchte ich die Diashow nicht vollständig anhalten, nur pausieren.

Answer 1

Ich denke, Sie müssen nur die Zeitüberschreitung zurücksetzen. Wenn die Timeout-Einstellung, halten einen Verweis darauf:

var tout; //declare a variable that will hold reference to your timeout*** 
var step = 0; 
function slideIt(){ 
    if(!document.images) return; 
    document.getElementById('slide').src = slideshow[step].src; 
     if (step < 3) { 
      step++; 
     } 
     else { 
      step = 0; 
     } 
    tout = setTimeout(slideIt, 3500); //*** 
} 

Dann, wenn Benutzer klickt, das Timeout zurückgesetzt, dh es wieder machen beginnen:

clearTimeout(tout); 
tout = setTimeout(slideIt, 3500); 

Oder besser, wickeln Sie es in ein separate Funktion:

function restartTimeout() { 
    clearTimeout(tout); 
    tout = setTimeout(slideIt, 3500); 
} 

Und gerade aus slideIt() diese Funktion aufrufen.

PS. Stellen Sie sicher, dass die Anzahl der Folien in Ihrem endgültigen Code nicht fest codiert ist (ich meine 3 in Ihrem Schnipsel) und erinnern Sie sich an DRY Regel (wiederholen Sie nicht): Ihre Funktionen scheinen sehr ähnlich zu sein.