MouseEvent screenX Property

DOM Events MouseEvent

Definition and Usage

The screenX property returns the horizontal coordinate of the mouse pointer at the time the event is triggered (relative to the user's computer screen).

Tip:To get the vertical coordinate of the mouse pointer (relative to the user's computer screen), use screenY Property.

Note:This property is read-only.

Instance

Example 1

Get the mouse pointer's coordinates relative to the screen when the mouse button is clicked on an element:

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

Try It Yourself

Example 2

Demonstrate the difference between clientX and clientY, and screenX and 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;

Try It Yourself

Syntax

event.screenX

Technical Details

Return Value: A numeric value representing the horizontal coordinate of the mouse pointer, in pixels.
DOM Version: DOM Level 2 Events

Browser Support

Property Chrome IE Firefox Safari Opera
screenX Support Support Support Support Support

Related Pages

HTML DOM Reference Manual:MouseEvent screenY Property

HTML DOM Reference Manual:MouseEvent clientX Property

HTML DOM Reference Manual:MouseEvent clientY Property

HTML DOM Reference Manual:MouseEvent offsetX Property

HTML DOM Reference Manual:MouseEvent offsetY Property

DOM Events MouseEvent