MouseEvent screenX Property

The name of the pictureThe name of the pictureThe name of the pictureClash Royale CLAN TAG#URR8PPP








googletag.cmd.push(function() googletag.display('div-gpt-ad-1422003450156-2'); );




MouseEvent screenX Property



❮ DOM Events
❮ MouseEvent




Example


Get coordinates of the mouse pointer, 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 »

More "Try it Yourself" examples below.



Definition and Usage


The screenX property returns the horizontal coordinate (according to the users computer screen) of the mouse pointer when an event was triggered.


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


Note: This property is read-only.



Browser Support














Property
screenX Yes Yes Yes Yes Yes






googletag.cmd.push(function() googletag.display('div-gpt-ad-1493883843099-0'); );





Syntax



event.screenX


Technical Details






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

More Examples



Example


A demonstration of the differences 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 »


Related Pages


HTML DOM reference: MouseEvent screenY Property


HTML DOM reference: MouseEvent clientX Property


HTML DOM reference: MouseEvent clientY Property




❮ DOM Events
❮ MouseEvent