event Properties DHTML Events
DOM Level 2 Specification.
Retrieves the horizontal position of the mouse relative to the object firing the event.
| HTML |
N/A |
| Script |
[ iCoord = ] event.offsetX |
| iCoord |
Integer representing the horizontal coordinate, in pixels. |
The property is read-only with no default value.
This property returns the x-coordinate of the cursor position at which the event occurred, relative to the left edge of the object where the event is contained.
The coordinates match the offsetLeft and offsetTop properties of the object. Use offsetParent to find the container object that defines this coordinate system.
The following example demonstrates use of the offsetX property to determine the mouse position relative to the container that fired the event. The status window shows the mouse position at all times relative to the body.
<script language="JavaScript">
function offsetCoords ( ) {
var el = event.srcElement.tagName;
var offsetInfo = "";
offsetInfo = "The offsetX coordinate
relative to the "+el+" is: " +
window.event.offsetX + "\r"
offsetInfo += "The offsetY coordinate
relative to the "+el+" is: " +
window.event.offsetY + "\r"
alert ( offsetInfo );
}
</script>
<body onmousemove="window.status='X " +
window.event.offsetX + ' Y " +
window.event.offsetY" ondblclick="offsetCoords ( )">
Double click anywhere ...
<div onclick="offsetCoords ( );"
style="width:400; background:black; color:khaki;
padding:20">Click in this black ... </div>
Show me
event
clientX, clientY, offsetY, screenX, screenY