Come utilizzare la proprietà Mouseevent Pagey?

Come utilizzare la proprietà Mouseevent Pagey?

Una proprietà dell'evento chiamata "Pagey"Mostra le coordinate dell'asse Y quando l'utente muove il mouse. Questa proprietà consente di trovare la posizione del cursore per implementare funzionalità interattive come menu a discesa o tool conti, ecc. Questa proprietà può essere utile in una varietà di applicazioni, come la creazione di effetti di monitoraggio del mouse personalizzati o l'implementazione di funzionalità di trascinamento.

Questa guida dimostra come utilizzare la proprietà MouseEvent Pagey.

Come utilizzare la proprietà Mouseevent Pagey?

IL "Pagey"La proprietà viene utilizzata per visualizzare le coordinate dell'asse Y sullo schermo rispetto al movimento del cursore del mouse. È misurato in pixel dal bordo superiore del Viewport. Seguire i passaggi seguenti per una spiegazione migliore:

Passaggio 1: creazione di struttura

All'interno del genitore ""Elemento, crea multipli"

" E "

"Tag in cui vengono visualizzate le coordinate assegnando"id"Ad ogni elemento HTML:





Esempio di proprietà Event Pagey Event Mouse


Benvenuti in Linuxhint:


X Coordinate:


Y Coordinate:


Alla fine, selezionare "My-Element"Id e applica alcune proprietà CSS ad esso per un migliore processo di visualizzazione.

Passaggio 2: aggiunta di proprietà Pagey

Dentro il ""Tag, aggiungi le seguenti proprietà. Queste proprietà devono essere aggiunte alla fine della pagina oppure il codice non funziona correttamente:

Di seguito è indicata una spiegazione dello snippet di codice sopra:

  • Innanzitutto, l'elemento HTML è memorizzato nella variabile accedendo agli ID elementi.
  • Quindi, la funzione viene chiamata sul "mousemove"Ascoltatore di eventi.
  • Successivamente, la variabile denominata "Pagey" E "Pagex" è creato. Quindi, queste variabili vengono utilizzate con "evento.Pagey" E "evento.Pagex"Proprietà, rispettivamente. Questi valori ottengono rispettivamente le coordinate dell'asse Y e X.
  • Alla fine, queste variabili vengono visualizzate sulla pagina Web accedendo al "id "della" span" elementi.

Dopo aver eseguito lo snippet del codice sopra, l'output sembra così:

L'output di cui sopra visualizza che le coordinate sono visualizzate nella pagina web rispetto al movimento del cursore.

Conclusione

IL "Pagey"La proprietà ottiene la coordinata del cursore sul movimento del mouse sopra l'elemento contenente selezionato. Per farlo funzionare, usa il "mousemove"Ascoltatore di eventi che chiama la funzione quando il mouse si sposta sull'elemento div selezionato. E al suo interno utilizza il "evento.Pagey"Proprietà per ottenere le coordinate dell'asse Y. Questa guida ha dimostrato come utilizzare la proprietà MouseEvent Pagey.