Come fare un JavaScript Immagine rollover

May 2

Un rollover immagine JavaScript è un interessante gruppo di codice HTML e JavaScript; quando un utente punti sito in una foto, un'altra immagine prende il suo posto. Quando l'utente sposta il mouse di distanza dalla foto, l'immagine originale ritorna in vista. Dopo aver trovato due immagini che si desidera utilizzare, seguire queste istruzioni per fare un rollover immagine di tua scelta.

istruzione

1 Aprire Blocco note o il vostro programma di authoring HTML preferito. Contrassegnare il documento con tag di apertura di base come segue.

3 Chiudere i tag di base nell'intestazione del documento. Successivamente, iniziare il corpo del documento.

4 Scrivere il codice per dire l'immagine come comportarsi quando il cursore del mouse si muove sopra l'immagine o lontano dal quadro, come segue. "SamplePage.html" può essere sostituito con qualsiasi collegamento di vostra scelta. Si noti che "pictureTwo.src" e "pictureOne.src" corrispondono i nomi degli oggetti che si stabilito in precedenza.
<A href = "SamplePage.html"

onMouseOver="document.sample.src = pictureTwo.src;"
onMouseOut="document.sample.src = pictureOne.src;">

5 Dite al documento, quale immagine da visualizzare quando la pagina viene caricata. Avviso nominando il "campione", contenitore di immagine che si sta utilizzando lo stesso nome di oggetto come il gruppo precedente di codice (document.sample.src).
<Img src = "samplepicture1.jpg"

Name="sample">

6 Terminate codifica il documento chiudendo le restanti tag HTML.