Atributo pageY do MouseEvent

Eventos DOM MouseEvent

Definição e uso

Quando um evento de mouse é acionado, o atributo pageY retorna a coordenada vertical do ponteiro do mouse (relativa ao documento).

O documento é a página da web.

Dica:Para obter a coordenada horizontal do ponteiro do mouse (relativa ao documento), use Atributo pageX.

Notas:Este atributo é de leitura.

Notas:Este atributo não é padrão, mas é aplicável a maioria dos navegadores principais.

Exemplo

Exemplo 1

Ao clicar no botão do mouse sobre o elemento, mostre as coordenadas do ponteiro do mouse:

var x = event.pageX;     // Obter a coordenada horizontal
var y = event.pageY;     // Obter a coordenada vertical
var coor = "X coords: " + x + ", Y coords: " + y;

Experimente você mesmo

Exemplo 2

Ao mover o ponteiro do mouse sobre o elemento, mostre as coordenadas do ponteiro do mouse:

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

Experimente você mesmo

Exemplo 3

Demonstre a diferença entre clientX e clientY e screenX e screenY:

var pX = event.pageX;
var cX = event.clientX;
var pY = event.pageY;
var cY = event.clientY;
var coords1 = "page - X: " + pX + ", Y coords: " + pY;
var coords2 = "client - X: " + cX + ", Y coords: " + cY;

Experimente você mesmo

Sintaxe

event.pageY

Detalhes técnicos

Retorno: Valor numérico, que representa a coordenada vertical do ponteiro do mouse, em pixels.
Versão DOM: Nenhum.

Suporte do navegador

Atributo Chrome IE Firefox Safari Opera
pageY Suporte 12.0 Suporte Suporte Suporte

Páginas relacionadas

Manual de referência do HTML DOM:Propriedade pageX do MouseEvent

Manual de referência do HTML DOM:Propriedade clientX do MouseEvent

Manual de referência do HTML DOM:Propriedade clientY do MouseEvent

Manual de referência do HTML DOM:Propriedade screenX do MouseEvent

Manual de referência do HTML DOM:Propriedade screenY do MouseEvent

Eventos DOM MouseEvent