JavaScript passo passo

Registrare un event handler e catturare un evento con Netscape Navigator

Ricordato che questo esempio è valido soltanto per utenti con browser Navigator 4.5 o superiore, spostando il puntatore del mouse si dovrebbe notare lo spostamento di una piccola immagine.

Lo scopo del semplice script è quello di mostrare quanto definito nella sezione dedicata alla gestione degli eventi per il browser Netscape, quindi si può esaminare il codice:

// setto la cattura dell'evento di movimento del mouse per la finestra window.captureEvents(Event.MOUSEMOVE); // definisco una funzione che determina lo spostamento dinamico del livello contenente l'immagine function handleMouseMove(evt){ document.layers['spotl'].top=evt.pageY; document.layers['spotl'].left=evt.pageX + 30; document.layers['spotl'].visibility='show'; return true; } // registro la chiamata alla funzione per ogni evento di movimento del mouse rintracciato dalla finestra window.onmousemove=handleMouseMove;

Ciò che interessa in questa sede è notare nel codice le seguenti definizioni:

• window.captureEvents(Event.MOUSEMOVE) - per settare la cattura dell'evento mousemove da parte dell'oggetto window;
• Event.MOUSEMOVEEvent rappresenta l'oggetto Event, MOUSEMOVE (in maiuscolo), l'evento prescelto;
• function handleMouseMove(evt){[...]} - la funzione costruita dal programmatore per gestire l'evento
  la funzione in generale prende come parametro lo specifico evento e, pur non essendo utilizzato in questo esempio, setta un valore di ritorno;
• window.onmousemove=handleMouseMove - per registrare il gestore ed assegnarli nominalmente (quindi col solo nome non seguito dalle parentesi) la funzione da svolgere.

In questo modo, mouvendo il mouse all'interno della finestra, saranno eseguite le righe di codice che permettono lo spostamento del layer contenente l'immagine. Per calcolare la posizione del mouse sono state utilizzate le proprietà pageX e pageY dell'oggetto Event.

chiudi