Fires when the user moves the mouse over the object.
| Inline |
<element onmousemove = "handler" ... > |
| Script |
object.onmousemove = handler |
| Bubbles |
Yes |
| Cancels |
No |
| To invoke |
Move the mouse over the document. |
| Default action |
Initiates any action associated with this event. |
A mousemove event occurs when the pointing device is moved while it is over an element.
This event is valid for most elements.
While event handlers in the Document Object Model do not receive parameters directly, the handler can query the event object for data.
Event Object Properties
| altKey |
Retrieves the current state of the ALT key. |
| cancelBubble |
Sets or retrieves whether the current event should bubble up the hierarchy of event handlers. |
| clientX |
Retrieves the x-coordinate of the position of the cursor when the mouse is clicked, relative to the size of the client area of the window but excluding window decorations or scroll bars. |
| clientY |
Returns the y-coordinate of the position of the cursor when the mouse is clicked, relative to the size of the client area of the window but excluding window decorations or scroll bars. |
| ctrlKey |
Retrieves the state of the CTRL key. |
| offsetX |
Retrieves the horizontal coordinate of the mouse's position relative to the object firing the event. |
| offsetY |
Retrieves the vertical coordinate of the mouse's position relative to the object firing the event. |
| screenX |
Retrieves the horizontal position of the mouse, in pixels, relative to the user's screen. |
| screenY |
Retrieves the vertical position of the mouse, in pixels, relative to the user's screen. |
| shiftKey |
Retrieves the state of the SHIFT key. |
| srcElement |
Retrieves the object that fired the event. |
| type |
Retrieves the event name from the event object. |
| x |
Returns the horizontal position of the mouse when the event fires. |
| y |
Returns the vertical position of the mouse when the event fires. |
The following sample demonstrates the use of the onmousemove event to monitor the location of the mouse cursor on the screen.
When the mouse cursor moves over the DIV object, a SPAN object is updated with the clientX and clientY property values. The clientX and clientY properties are exposed by the event object.
Sample Code
<head>
. . .
<script language="JavaScript">
function trackMouse ( ) {
oNotice.innerText="Coords: (" +
event.clientX + ", " + event.clientY + ")";}
</script>
</head>
<body>
. . .
<div align="center" id=oScratch
onmousemove="trackMouse()">
<span id=oNotice></span></div>
</body>
Show me
onmousedown, onmouseout, onmouseover, onmouseup