Coesistenza di Immagini.gif gestite da JavaScript
  <img src="imagesM/mouse0.gif" name=animationM width=345 height=96>
<script language=javascript>
<!--Copia & Incolla da : <img src=....... fino a .......</form>
imagesM = new Array(14);
for(var i = 0; i < 14; i++) { imagesM[i] = new Image(); imagesM[i].src = "imagesM/mouse" + i + ".gif"; }
function aggiornaM(){ document.animationM.src = imagesM[UrlAtCacheM].src;
UrlAtCacheM = (UrlAtCacheM + 1)%14; idM=setTimeout("aggiornaM()",88);}
var UrlAtCacheM = 0; idM=null;/* NotaBene : Se si sotituisce 0 oppure null ad 88 lo Script continua a funzionare(male).Se si sostituisce null a idM c'é un blocco di errore, "impossibile assegnare a null",Se si an-null-a invece l'assegnazione (cancellandola) allora l'interprete legge lo Script senza implementare un errore, con il risultato che ad ogni Click su Start si avanza di un fotogramma-url.*/
/*document.images[0].src=aggiornaM();Ammesso che l'immagine 0 sia la stessa nell'Array della Pagina, questo é un sistema di richiamarla onload, non si presta perciò a flessibili Copia & Incolla*/
//-->Per richiamare solo una immagine invece di aggiornaM() che le richiama tutte : imagesM[8].src;
</script><body OnLoad="aggiornaM()">
<form> <input type=button value="Start"onClick="if(!idM ==null)aggiornaM()"> 
<input type="button" value="Stop"onClick="if (idM) clearTimeout(idM); idM=null;"> </form>

Lo sfarfallio grigio é dovuto alla seguente istruzione
posta in uno Script in fondo a questa pagina :
imagesM[0].src=images[0].src;
Le istruzioni all'interprete per la Gestione dell'Evento Stop vanno interpretate così : "Se all'oggetto idM applichi clearTimeout(idM) riporta anche il valore di idM=null; non il valore di aggiornamento gestito o transitante, ma l'assegnazione che é :
idM = null=setTimeout("aggiornaM()"88,)"; =NULL Vedi : /* NotaBene */

<!--Memo : Nella successiva animationS questa immagine (document.images[1].src;) é visibile solo per poco mentre si aggiorna.  -->
<img src="images/0.gif" name=animationS width=123 height=89>
<script language=javascript>
<!--Memo : Vedi sotto l'allocazione dell'istruzione che su Copia & Incolla non viene implementata.
/* Start : (Se non c'é idS = !idS) if(!idS && nic==10) aggiornaS()*/
var nic = 0;//Questo é il numero delle immagini caricate.
var UrlAtCacheS = 0;//Parte con l'immagine 0
var idS = null;//Impedisce la partenza durante l'apertura della Pagina oltre a permettere l'arresto della gif.
function ci() {if (++nic ==10) aggiornaS();}
images = new Array(10);
for(var i = 0; i < 10; i++)
{images[i] = new Image();
images[i].onload=ci;
images[i].src = "images/" + i + ".gif"; }
function aggiornaS(){ document.animationS.src = images[UrlAtCacheS].src;
UrlAtCacheS = (UrlAtCacheS + 1)%10;
idS=setTimeout("aggiornaS()",250);}
//Questo é il posto dell'istruzione : document.images[2].src=document.images[1].src;
//-->                 Un'altra possibile sostituzione : document.images[2].src=imagesM[8].src;
</script>       <!--NB : animationS é : document.images[2].src i.e. la 3° immagine di questa Pagina.-->
<form> <input type=button value="Start"onClick="if(!idS && nic==10)aggiornaS()">
<input type="button" value="Stop"onClick="if (idS) clearTimeout(idS); idS=null;"></form>

var idS=null;   come anche più sopra var idM=null; oltre ad avere un ruolo nella gestione Stop, anche in Start é implementato proficuamente, qui evita che la funzione
aggiorna()  parta ad ogni Click se la gif é già avviata.
È necessario specificare document. per riferirsi all'immagine images[1], che é la Seconda nell'Array del documento, se scrivessi solo images[1] verrebbe prelevata la Seconda immagine di animationS, invece di Kissing.gif infatti nel documento é definito l'Array images[i] .


Collocazione dello Script per la Sostituzione delle Immagini

il Layout dello Script seguente é collocato dopo l'immagine vuota marcata in verde e lo Script legge regolarmente l'immagine, se si implementa un'immagine simile dopo lo Script l'interprete JavaScript non la vede, pur costituendo tale immagine le sue proprietà nell'Array delle immagini della pagina. Per questo Script <img dopo il Layout dello Script> non esiste, per uno Script implementato dopo <img> esiste,   perciò occorre sempre
Implementare l'immagine da gestire prima dello Script.
Se si scrive in questo Script : document.images[4].src per l'interprete l'oggetto non c'é e segnala un errore, fermando il caricamento della pagina.  

<center><img width="34"height=19></center>
<script language=javascript>
<!--
document.images[3].src=document.images[1].src;
//-->
</script>
<center><img></center>
img[3]



document.images[3].src=document.images[1].src;

img[4]


Questo è un'altro Script implementato
dopo <img> che rileva l'oggetto images [4]
document.images[3].src=document.images[1].src;
Top



 
Nome Assegnato: Fiori
Le dichiarazioni Script sovrascrivono la proprietà src definite in html,
le funzioni sovrascrivono le dichiarazioni e le definizioni in html
    Es1 Es2                Es3
Nome Assegnato : Stork
<script language=javascript>
<!-- Es6 Es6 & Es7 prelevano entrambi le immagini da animationS
Se si sposta l'istruzione sotto il 7° rigo il risultato é identico all'Es7.
document.Esempio1.src=imagesM[8].src;
document.Esempio2.src=document.images[5].src;
Esempio3.src=stork.src;/*Es9 */Esempio9.src=Fiori.src;
document.Esempio4.src=document.animationM.src; document.Esempio5.src=document.Esempio2.src;
document.Esempio6.src=document.animationS.src;
document.images[2].src=document.images[1].src;/*(7° rigo)*/
document.Esempio7.src=document.images[2].src;
document.Esempio8.src=document.images[2].src;
//--> Es7  Sovrascritto in animationS appena si avvia la funzione.
Se si pone nic=11 Es7 viene sovrascritto al Click su Start
</script>
Gli esempi numerati da 1 a 9 sono delle immagini vuote a cui é stato attribuito un nome, appunto : Esempio1...Esempio9.
Larghezza e altezza sono attribuite e ritoccate dove necessario.
<img name=Esempio8 width=23 height=12>
Per copiare un'immagine occorre innanzitutto implementare e nominare una collocazione e poi inserire in uno Script qualsiasi , a valle di questa immagine,
la riga di codice come in questo esempio riportata in giallo.
Lo spazio sottostante é occupato dalla prima immagine di animationM che é trasparente
Es4...()...Es4
Come si vede richiamando per nome un'immagine costruita fuori schermo si ottiene solo l'immagine di partenza dell'animazione

Es5NB:
<img name=Esempio2 width=45 height=45>
In origine non c'é assegnata alcuna proprietà src, questa é acquisita con la 2° istruzione di questo Script.
Top



Le mappe immagini
<script language=javascript>
<!-- Questo Script funziona soltanto con Navigator ! ed é l'equivalente di </blink>...</blink>
var blinkString="Lampeggia";
document.writeln("<center><b>"+blinkString.blink()+"</b></center>");
//-->L'equivalente, solo per Navigator é : </blink>...</blink>
</script>