È possibile animare testo, pulsanti e immagini sulla tua pagina Web con l'evento MouseOver. Ti permette di manipolare il codice HTML basato su azioni dell'utente. MouseOver funziona mano nella mano con l'evento MouseOut. MouseOver funziona quando il mouse passa sopra un oggetto, mentre il MouseOut funziona quando l'oggetto non è più selezionato. È possibile utilizzare MouseOver per modificare il testo e il colore dei pulsanti con poche righe di JavaScript.

Istruzioni

1

Avviare un editor di testo, ad esempio Blocco note, TextPad o EditPad. Selezionare "File" e "Apri" dal menu e fare doppio clic il file HTML che si desidera modificare.

2

Scorrere fino al tag < BODY > del file, dove va il pulsante.

3

Inserire il codice seguente per modificare il testo del pulsante con il mouse:

< input type = valore "pulsante" = "Clicca per cambiare Me" onmouseover="this.value='On'" onmouseout="this.value='Off'" / >

4

Sostituire "Fare clic su to Change Me" con il testo originale che consente di visualizzare prima il MouseOver. Sostituire "On" con il testo che viene visualizzato quando si tira sopra il pulsante. Sostituire "Off" con il testo che viene visualizzato quando il mouse passa il pulsante off.

5

Inserire il codice seguente per modificare il colore del pulsante con il mouse. Il colore originale del pulsante è rosso.

< tipo input = "pulsante" value = "Cambia colore" style = "background-colore: rosso;"

onmouseover="this.Style.BackgroundColor='blue'"

onmouseout="this.Style.BackgroundColor='yellow'" / >

6

Sostituire "rosso" con il colore originale del pulsante prima di MouseOver. Sostituire "blu" con il colore che viene visualizzato quando si tira sopra il pulsante. Sostituire "giallo" con il colore che viene visualizzato quando il mouse passa il pulsante off.