THE WORLD'S LARGEST WEB DEVELOPER SITE
HTMLCSSJAVASCRIPTSQLPHPBOOTSTRAPJQUERYANGULARXML
 

MouseEvent pageX Property

Event Object Reference Event Object

Example

Output the coordinates of the mouse pointer when the mouse button is clicked on an element:

var x = event.pageX;     // Get the horizontal coordinate
var y = event.pageY;     // Get the vertical coordinate
var coor = "X coords: " + x + ", Y coords: " + y;

The result of coor could be:

X coords: 162, Y coords: 40
Try it Yourself »

More "Try it Yourself" examples below.


Definition and Usage

The pageX property returns the horizontal coordinate (according to the document) of the mouse pointer when a mouse event was triggered.

The document is the web page.

Tip: To get the vertical coordinate (according to the document) of the mouse pointer, use the pageY property.

Note: This property is read-only.

Note: This property is non-standard, but works in most major browsers.


Browser Support

Property
pageX Yes 12.0 Yes Yes Yes

Syntax

event.pageX

Technical Details

Return Value: A Number, representing the horizontal coordinate of the mouse pointer, in pixels
DOM Version: None

Examples

More Examples

Example

Output the coordinates of the mouse pointer while the mouse pointer moves over an element:

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

Example

A demonstration of the differences between clientX and clientY and screenX and 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;
Try it Yourself »

Related Pages

HTML DOM reference: MouseEvent pageY Property

HTML DOM reference: MouseEvent clientX Property

HTML DOM reference: MouseEvent clientY Property

HTML DOM reference: MouseEvent screenX Property

HTML DOM reference: MouseEvent screenY Property


Event Object Reference Event Object