So I have an image
<img id="animation" onload="initAnimation()" src='run-1.png'>
And I want to animate the image using run-2.png, run-3.png, etc. Using Javascript,
var imageAnimation = document.getElementById('animation');
var images = ['run-1.png','run-2.png','run-3.png','run-4.png','run-5.png'];
var currentIteration = 0;
function initAnimation(){
animate();
}
function animate(){
for(i=0; i<images.length; i++){
imageAnimation.src = images[i]
}
animate();
}
But I can't seem to get the code to trigger. Do you see anything wrong with my code? My question is different than the checking for when the image has finished loading because I need to loop through many images.