Nei primi giorni del Web, i progettisti a volte ha aggiunto un sorprendente "cambiamento di colore" effetto ai loro siti. Quando un visitatore spostato il cursore del mouse sopra qualcosa in una pagina Web, lo sfondo della pagina è cambiato improvvisamente i colori. Non si può vedere questo effetto spesso oggi, ma è comunque possibile utilizzare sul tuo sito web. Ogni documento HTML ha un evento "mouseover". Collegando questo evento per un controllo nella pagina Web, è possibile effettuare il controllo innescare un cambiamento di colore di sfondo.

istruzione

1 Lanciate il vostro editor HTML o Notepad.

2 Aggiungere il seguente codice HTML alla sezione "corpo" del documento: Questo crea un pulsante con un valore id di "Button1".

<Input id = "Button1" type = valore "pulsante" = "tasto">

Questo crea un pulsante con un valore id di "Button1".

3 Individuare la sezione "testa" del documento.

4 Inserire il seguente codice all'interno di quella sezione:

<Script type = "text / javascript">

var newColor = "Red";

var mouseoverObject = "Button1";

window.onload = function () {

document.getElementById (mouseoverObject) .onmouseover = ChangeColor;}

Funzione ChangeColor () {

var bodyObject = document.getElementsByTagName ( 'body') [0];

bodyObject.style.backgroundColor = newColor;

}

</ Script>

La variabile chiamata "newColor" tiene il colore del colore a cui si desidera modificare lo sfondo della pagina. La variabile mouseoverObject contiene l'id dell'oggetto mouseover. In questo esempio, l'oggetto è il pulsante il cui ID è "Button1". La funzione window.onload aggiunge un evento mouseover al mouseoverObject. Questo evento chiama la funzione ChangeColor. Che funzione ottiene un riferimento a elemento "corpo" della pagina e cambia il suo colore di sfondo al colore si definisce nella variabile newColor.

5 Salvare il documento e aprirlo in un browser. Muovi il mouse sul pulsante. cambiamenti di colore di sfondo della pagina per rosso.

Consigli e avvertenze

• In questo esempio, un pulsante il cui ID è "Button1" fa scattare il cambiamento di colore. Per fare questo lavoro con un altro controllo ad esempio un'immagine, dare che controllano un valore ID, e assegnare alla variabile "mouseoverObject".
• Modificare il valore della variabile newColor JavaScript al nome di qualsiasi colore HTML valido. Siti come ad esempio W3Schools hanno tavole a colori che mostrano i nomi dei colori HTML è possibile scegliere.