Come modificare Script immagine al passaggio del mouse in XHTML

May 11

Come modificare Script immagine al passaggio del mouse in XHTML


elementi dinamici aggiungere interattività a una pagina Web. Uno di questi elementi consente agli sviluppatori di inserire due immagini in un unico luogo. Qualunque immagine mostra dipende dal fatto che un visitatore ha il puntatore del mouse sull'immagine inizialmente caricata. L'aggiunta di un tale effetto può essere modificato all'interno di documenti XHTML utilizzando una riga di codice.

istruzione

1 Carica due immagini a un server Web. Entrambe le immagini dovrebbero essere identico dimensionati. Nota i loro percorsi URL.

2 Avviare un editor HTML. Utilizzare il Blocco note (PC) o TextEdit (Mac) se non è disponibile. Entrambi sono preinstallato sui sistemi operativi Windows o Apple.

3 Selezionare "File" e "Apri" dal menu di navigazione del programma. Scegliere il file XHTML, dove verrà incorporato lo script immagine.

4 Posizionare il seguente script in cui l'immagine dovrebbe risiedere:
<Img src = "image_one.jpg" onmouseover = "this.src = 'image_two.jpg'" onmouseout = "this.src = 'image_one.jpg'" />

Sostituire "image_one.jpg" e "image_two.jpg" con i percorsi URL delle immagini caricate. Il "src" iniziale è l'immagine che viene visualizzata al caricamento della pagina. L'immagine legata a "onmouseover" è quello che mostra quando il mouse passa sopra l'immagine iniziale. "Onmouseout" è l'immagine che viene visualizzata quando il cursore viene rimosso dalla zona dell'immagine.

5 Selezionare "File" e "Salva" dal menu di navigazione del programma. Assicurarsi che l'estensione del file è .htm o .html. HTML e XHTML utilizzano tali estensioni.

6 Carica il file su un server Web. Anteprima per confermare lo script funziona correttamente.