Sys.UI.DomEvent offsetX Field

Gets the x-coordinate of the mouse pointer's position relative to the object that raised the event.

var offsetX = domElementVar.offsetX;

Return Value

An integer that represents the x-coordinate in pixels.

Remarks

Use the offsetX field to get the horizontal offset between the mouse position and the left side of the object that raised the event.

Example

The following example shows how to use the offsetX field to retrieve the x-coordinate of the mouse pointer's position relative to the object that raised the event.

<script type="text/javascript">
    Sys.UI.DomEvent.addHandler($get("Button1"), "click", processEventInfo);

    function processEventInfo(eventElement) {
        var result = '';
        try {
            result += "altKey = " + eventElement.altKey + "<br/>";
            result += "button = " + eventElement.button + "<br/>";
            result += "keyCode = " + eventElement.keyCode + "<br/>";
            result += "clientX = " + eventElement.clientX + "<br/>";
            result += "clientY = " + eventElement.clientY + "<br/>";
            result += "ctrlKey = " + eventElement.ctrlKey + "<br/>";
            result += "offsetX = " + eventElement.offsetX + "<br/>";
            result += "offsetY = " + eventElement.offsetY + "<br/>";
            result += "screenX = " + eventElement.screenX + "<br/>";
            result += "screenY = " + eventElement.screenY + "<br/>";
            result += "shiftKey = " + eventElement.shiftKey + "<br/>";
            result += "target.id = " + eventElement.target.id + "<br/>";
            result += "type = " + eventElement.type + "<br/>";
        }
        catch(e) {
            alert("Error:" + e.message);
        }
        $get('Label2').innerHTML = result;
    }
 </script>

<script type="text/javascript">
    Sys.UI.DomEvent.addHandler($get("Button1"), "click", processEventInfo);

    function processEventInfo(eventElement) {
        var result = '';
        try {
            result += "altKey = " + eventElement.altKey + "<br/>";
            result += "button = " + eventElement.button + "<br/>";
            result += "keyCode = " + eventElement.keyCode + "<br/>";
            result += "clientX = " + eventElement.clientX + "<br/>";
            result += "clientY = " + eventElement.clientY + "<br/>";
            result += "ctrlKey = " + eventElement.ctrlKey + "<br/>";
            result += "offsetX = " + eventElement.offsetX + "<br/>";
            result += "offsetY = " + eventElement.offsetY + "<br/>";
            result += "screenX = " + eventElement.screenX + "<br/>";
            result += "screenY = " + eventElement.screenY + "<br/>";
            result += "shiftKey = " + eventElement.shiftKey + "<br/>";
            result += "target.id = " + eventElement.target.id + "<br/>";
            result += "type = " + eventElement.type + "<br/>";
        }
        catch(e) {
            alert("Error:" + e.message);
        }
        $get('Label2').innerHTML = result;
    }
 </script>

See Also

Reference

Sys.UI.DomEvent Class

Other Resources

Language Reference