The MouseEvent.clientX read-only property provides the horizontal coordinate within the application's client area at which the event occurred (as opposed to the coordinates within the page). For example, clicking in the top-left corner of the client area will always result in a mouse event with a clientX value of 0, regardless of whether the page is scrolled horizontally.
Syntax
var x = instanceOfMouseEvent.clientX
Return value
A number
Example
<!DOCTYPE html>
<html>
<head>
<title>clientX\clientY example</title>
<script>
function showCoords(evt){
alert(
"clientX value: " + evt.clientX + "\n" +
"clientY value: " + evt.clientY + "\n"
);
}
</script>
</head>
<body onmousedown="showCoords(event)">
<p>To display the mouse coordinates click anywhere on the page.</p>
</body>
</html>
Specifications
| Specification | Status | Comment |
|---|---|---|
| Document Object Model (DOM) Level 3 Events Specification The definition of 'MouseEvent.clientX' in that specification. |
Working Draft | No change from Document Object Model (DOM) Level 2 Events Specification. |
| Document Object Model (DOM) Level 2 Events Specification The definition of 'MouseEvent.clientX' in that specification. |
Recommendation | Initial definition. |
Browser compatibility
| Feature | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | (Yes) | (Yes) | 6 | (Yes) | (Yes) |
| Feature | Firefox Mobile (Gecko) | Android | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | ? | ? | ? | ? | ? |