Le 12 immagini, tratte da Processing.org, realizzano un’animazione se visualizzate una dopo l’altra.
Agisci sui comandi di play e stop.
<img alt="Animazione" id="animazione" /><br/>
<input type="button" value="PLAY" onClick="funPlay()" /> <input type="button" value="STOP" onClick="funStop()" />
<script>
var PATH ="https://www.valcon.it/javascript/wp-content/uploads/a";
var EXT =".gif";
var FRAME =12;
var frame =0;
var codice =0;
var immagine=document.getElementById("animazione");
function cambia()
{
frame=frame+1;
if(frame == FRAME)
frame=0;
immagine.src=PATH+frame+EXT;
}
function funPlay()
{
if(codice == 0)
codice=setInterval("cambia()", 200);
}
function funStop()
{
clearInterval(codice);
codice=0;
}
cambia();
</script>