Pivellino on mouseover onmouseout

[Zulkifar2]

Sto leggendo una guida su Javascript trovata qui su html.it...

Non ho capito a che serve document.images[num] qui di seguito[/list]

• <A HREF="#" onmouseover="document.images[num].src='immagine.gif'" onmouseout=document.images[num].src='immagine1.gif'">

images[num] individua il numero di indice della figura nella pagina e si ottiene contando il numero dei tag IMG contando da 0 fino a giungere al tag della figura che ci interessa.

Perchè devo dirgli il numero di indice dell'immagine?
E' il numero di indice di "immagine.gif" poi?
Ma se gli dico di prendere immagine.gif perchè devo specificare pure l'indice?

Qualcuno mi chiarisce le idee? Grazie

[seed_squall_it]

Quando il browser visualizza una pagina web, indicizza molti elementi "raggruppandoli" in degli array, come ad es. forms (l'array di tutti i form presenti nel documento), images (l'array di tutte le immagini presenti nel documento), ecc.

Ovviamente, gli elementi sono indicizzati all'interno degli array in base al loro "ordine" nel codice. Quindi, la prima immagine di un documento sarà identificata da document.images[0], la seconda da document.images[1], ecc.

Questo però identifica solo l'"oggetto" in sé. Ogni oggetto in JS ha delle proprietà e dei metodi (le prime corrispondono spesso agli attributi HTML del tag di quell'oggetto specifico, mentre i secondi sono come le "azioni" che questi oggetti possono compiere). In particolare, l'attributo src in HTML identifica la source (ovvero il path) dell'immagine, e quindi in JS la proprietà src dell'oggetto image identifica la stessa cosa.

Nel codice che hai postato si capisce chiaramente che al mouseover e al mouseout sul collegamento, JS modifica il path dell'immagine identificata dall'indice "num" nell'array images. Supponendo che num sia 1, lo script non fa altro che sostituire alla seconda immagine del documento (document.images[1]) un'immagine diversa da quella che compare nella pagina tramite l'impostazione di una nuovo valore per la proprietà src:

document.images[1].src = "immagine.gif";

/* Sostituisce la seconda immagine del documento,
qualunque essa sia, con una nuova immagine che si
trova nella stessa cartella della pagina e che si
chiama "immagine.gif" */