Cómo usar la propiedad MouseEvent Pagey?

Cómo usar la propiedad MouseEvent Pagey?

Una propiedad de evento llamada "pagina"Muestra el eje Y coordenadas cuando el usuario mueve su mouse. Esta propiedad permite encontrar la ubicación del cursor para implementar características interactivas como menús desplegables o información sobre herramientas, etc. Esta propiedad puede ser útil en una variedad de aplicaciones, como la creación de efectos de seguimiento de mouse personalizado o la implementación de la funcionalidad de arrastrar y soltar.

Esta guía demuestra cómo usar la propiedad Mouseevent Pagey.

Cómo usar la propiedad MouseEvent Pagey?

El "paginaLa propiedad se utiliza para mostrar las coordenadas del eje Y en la pantalla en relación con el movimiento del cursor del mouse. Se mide en píxeles desde el borde superior de la ventana gráfica. Siga los pasos a continuación para una mejor explicación:

Paso 1: Creación de estructura

Dentro del padre ""Elemento, crea múltiples"

" y "

"Etiquetas en las que se muestran las coordenadas asignando"identificación"A cada elemento HTML:





Evento de ratón Pagey Propiedad Ejemplo


Bienvenido a Linuxhint:


X coordenadas:


Y coordenadas:


Al final, seleccione el "my-elementoID y aplicar algunas propiedades CSS para un mejor proceso de visualización.

Paso 2: Agregar propiedad Pagey

Dentro de ""Etiqueta, agregue las siguientes propiedades. Estas propiedades deben agregarse al final de la página o el código no funciona correctamente:

A continuación se establece una explicación del fragmento de código anterior:

  • Primero, el elemento HTML se almacena en la variable accediendo a los ID de elemento.
  • Entonces, la función se llama en el "movimiento del ratón"Event Listener.
  • Después de eso, la variable nombró "pagina" y "Pagex" es creado. Luego, estas variables se utilizan con "evento.pagina" y "evento.Pagex"Propiedades, respectivamente. Estos valores obtienen las coordenadas del eje Y y X respectivamente.
  • Al final, estas variables se muestran en la página web accediendo al "id "del" tramo"Elementos.

Después de ejecutar el fragmento de código anterior, la salida se ve así:

La salida anterior muestra que las coordenadas se muestran en la página web en relación con el movimiento del cursor.

Conclusión

El "pagina"La propiedad obtiene la coordenada del cursor en el movimiento del mouse sobre el elemento de contención seleccionado. Para que funcione, use el "movimiento del ratón"Oyente de eventos que llama a la función cuando el mouse se mueve sobre el elemento DIV seleccionado. Y dentro de él utiliza el "evento.pagina"Propiedad para obtener las coordenadas del eje Y. Esta guía demostró cómo usar la propiedad Mouseevent Pagey.