Atributo clientY del MouseEvent

Eventos DOM MouseEvent

Definición y uso

Cuando se activa un evento de ratón, la propiedad clientY devuelve la coordenada vertical del puntero del ratón (según el área del cliente).

El área del cliente es la ventana actual.

Consejo：Para obtener la coordenada horizontal del puntero del ratón (según el área del cliente), utilice Atributo clientX。

Comentarios：Esta propiedad es de solo lectura.

Ejemplo

Ejemplo 1

Al hacer clic en el botón del ratón sobre el elemento, se mostrarán las coordenadas del puntero del ratón：

var x = event.clientX;     // Obtener la coordenada horizontal
var y = event.clientY;     // Obtener la coordenada vertical
var coor = "X coords: " + x + ", Y coords: " + y;

Resultados：

X coords: 142, Y coords: 99

Prueba tú mismo

Ejemplo 2

Al moverse el puntero del ratón sobre el elemento, se mostrarán las coordenadas del puntero del ratón：

var x = event.clientX;
var y = event.clientY; 
var coor = "X coords: " + x + ", Y coords: " + y;
document.getElementById("demo").innerHTML = coor;

Prueba tú mismo

Ejemplo 3

Demostrar la diferencia entre clientX y clientY y screenX y screenY：

var cX = event.clientX;
var sX = event.screenX;
var cY = event.clientY;
var sY = event.screenY;
var coords1 = "client - X: " + cX + ", Y coords: " + cY;
var coords2 = "screen - X: " + sX + ", Y coords: " + sY;

Prueba tú mismo

Sintaxis

event.clientY

Detalles técnicos

Valor devuelto： Valor numérico que representa la coordenada vertical del puntero del ratón en píxeles.
Versión DOM： DOM Level 2 Events

Compatibilidad del navegador

Atributo Chrome IE Firefox Safari Opera
clientY Soporte Soporte Soporte Soporte Soporte

Páginas relacionadas

Manual de referencia del DOM HTML:Propiedad clientX del MouseEvent

Manual de referencia del DOM HTML:Propiedad screenX del MouseEvent

Manual de referencia del DOM HTML:Propiedad screenY del MouseEvent

Manual de referencia del DOM HTML:Propiedad offsetX del MouseEvent

Manual de referencia del DOM HTML:Propiedad offsetY del MouseEvent

Eventos DOM MouseEvent