En JavaScript:
pageX, pageY, screenX, screenY, clientX, Y clientYdevuelve un número que indica el número de “píxeles CSS” físicas un punto es desde el punto de referencia. El punto de evento es donde el usuario hizo clic, el punto de referencia es un punto en la esquina superior izquierda. Estas propiedades devuelven la distancia horizontal y vertical desde ese punto de referencia.
pageXy pageY: en
relación con la parte superior izquierda del área de contenido totalmente representada en el navegador. Este punto de referencia está debajo de la barra de URL y el botón Atrás en la esquina superior izquierda. Este punto podría estar en cualquier lugar de la ventana del navegador y puede cambiar de ubicación si hay páginas desplazables incrustadas dentro de las páginas y el usuario mueve una barra de desplazamiento.
screenXy screenY: en
relación con la parte superior izquierda de la pantalla / monitor físico, este punto de referencia solo se mueve si aumenta o disminuye el número de monitores o la resolución del monitor.
clientXy clientY:
Relativo al borde superior izquierdo del área de contenido ( la ventana gráfica ) de la ventana del navegador. Este punto no se mueve incluso si el usuario mueve una barra de desplazamiento desde el navegador.
Para una visualización en qué navegadores admiten qué propiedades:
http://www.quirksmode.org/dom/w3c_cssom.html#t03
w3schools tiene un intérprete y editor de Javascript en línea para que pueda ver lo que cada uno hace
http://www.w3schools.com/jsref/tryit.asp?filename=try_dom_event_clientxy
<!DOCTYPE html>
<html>
<head>
<script>
function show_coords(event)
{
var x=event.clientX;
var y=event.clientY;
alert("X coords: " + x + ", Y coords: " + y);
}
</script>
</head>
<body>
<p onmousedown="show_coords(event)">Click this paragraph,
and an alert box will alert the x and y coordinates
of the mouse pointer.</p>
</body>
</html>
