img Austausch Iteration Timeout mit js

Question

fand ich diesen Javascript-Code, der meine Bilder von #Animation nimmt und führt sie in einer Schleife nacheinander:

onload = function startAnimation() { 

var frames = document.getElementById("animation").children; 
var frameCount = frames.length; 
var i = 0; 


onload = setInterval(function() { 

    frames[i % frameCount].style.display = "none"; 

    frames[++i % frameCount].style.display = "block"; 

    } 
}, 300); 
} 

Ich habe 2 Fragen zu diesem Thema:

1. Wie bekomme ich es, um eine Pause von 2 Sekunden zu machen, wenn es zum letzten Bild kommt.

2. Ich werde wirklich appriciate, wenn jemand dieses Stück Code erklären kann:

frames [i% Framecount] .style.display = "none";

Frames [i ++% Framecount] .style.display = "block";

Ich habe so etwas noch nie gesehen. es sieht nach Schleife aus, aber anders.

Answer 1

1. Versuchen Sie, diese

var frames = document.getElementById("animation").children; 

var frameCount = frames.length; 
var i = 0; 
var x1 = 2000; 

function calllink() { 

    frames[i % frameCount].style.display = "none"; 

    frames[++i % frameCount].style.display = "block"; 

    if ((i % frameCount) == (frameCount - 1)) { 
    setTimeout(calllink, x1); 
    } else { 
    setTimeout(calllink, 300); 
    } 
}; 
setTimeout(calllink, 300); 

Hier ist ein Beispiel, wo ich die obigen Logik Fiddle

---

2.i % (modulus) frameCount für die Führung der Zählung innerhalb umgesetzt 0 bis maximale Bildanzahl für unendliche Zeit.

Beispiel:

Let frameCount = 10 and i = 0 

i % frameCount = 0 % 10 = 0 

++i % frameCount = 1 % 10 = 1 

... 
... 

Wenn ich == frameCount dh i == 10, wird es keinen 10. Frame (Bilder werden von 0 bis 9)

So

10 % 10 = 0 
11 % 10 = 1 

... 
... 
And so on.. 

Und jeder Wenn die Funktion aufgerufen wird, setzt sie den nächsten Frame, der sichtbar sein soll, und blendet den vorherigen Frame aus.

Answer 2

Es war eine gute Antwort hier von @Roberto aber es war irgendwie gelöscht. Ich würde mich freuen, wenn jemand wieder ein Beispiel schreiben kann, wie man den Code nach jeder Schleife pausiert.