Animated GIF's play only the first time their scene is visited

Ahh found a good example.

So the code ( single code used on scene load and unload ) would look something like

if (event.type === "HypeSceneLoad" ){ //- Run animation
 
	var imageNumber = 1;
	 
	var imgcontainer = hypeDocument.getElementById("imgcontainer")
	
window.globalID;
repeatOften()

function repeatOften() {
   if (imageNumber < 100){ //-- image total is 101 
	 imgcontainer.style.backgroundImage = 'url( ${resourcesFolderName}/test_' + ('0' + imageNumber).slice(-2) + '.gif)'
	 imageNumber++
	 } else {
	 
	 cancelAnimationFrame(window.globalID);//- Stop animation call
	  
	 }
  window.globalID = requestAnimationFrame(repeatOften);
}
 
}else {

console.log("stopped")
 cancelAnimationFrame(window.globalID); //- Stop animation call

} 

test_MHv3.hype.zip (1.5 MB)

I assume this is better because it works on the natural frame rate of the browser which is what this example is aiming for, so thats why it is better in this case ?..

3 Likes