x property

Sets or retrieves the x-coordinate (in pixels) of the mouse pointer, or user's finger, offset from the closest relatively positioned parent element of the element that fired the event.

Syntax

JavaScript

p = object.x

 

Property values

Type: Integer

the x-coordinate, in pixels.

Remarks

The property is read-only in Microsoft Internet Explorer 4.0, and read/write in Microsoft Internet Explorer 5 and later. In browser versions earlier than Internet Explorer 5, the x property retrieves a coordinate relative to the client.

If the event firing element is relatively positioned, then the x-coordinate from the boundary of the element is returned. If the event firing element and all of its parent elements are not relatively positioned, then the x property returns a coordinate relative to the body element.

The x property returns a coordinate relative to the body element.

If the mouse or finger is outside the window when the event is called, this property returns -1.

Examples

This example displays the current mouse position.

JavaScript
Copy 

<!DOCTYPE html>

<html>
<head>
  <title>x</title>
  <style>
    html, body {
      height: 100%;
      margin: 0;
      padding: 0;
    }
  </style>
</head>
<body>
  <div id="outputBox"></div>
  <script>
    document.getElementsByTagName('body')[0].addEventListener('mousemove', displayPointerPosition, false);

    var outputBox = document.getElementById('outputBox');
    function displayPointerPosition(evt) {
      outputBox.textContent = "(" + evt.x + ", " + evt.y + ")";
    }
  </script>
</body>
</html>

See also

event

 

 

Show: