View video tutorial

HTML onmousemove Attribute

HTML

The HTML onmousemove attribute is an event handler that triggers a script to execute when the mouse pointer moves over an element.

Definition and Usage


➔ It is used to trigger events for continuous mouse movement within the bounds of an element.

➔ The rate of event firing per millisecond depends on the platform, the speed of mouse movement, and the processing speed of the machine.

➔ The event object contains useful information, such as (clientX, clientY) which helps to get the real-time coordinates of the mouse pointer relative to the browser window.

Syntax
//In HTML
<element onmousemove="myFunction()"></element>
//In javascript
object.onmousemove = function() {myFunction()};
// Or using addEventListener
object.addEventListener("mousemove", myFunction);

Single left or middle mouse button click event sequence:

  • 1 onmousedown - is triggered when the mouse button is initially pressed down.
  • 2 onmouseup - is triggered when the mouse button is released.
  • 3 onclick - is fired after both mousedown and mouseup events.

Double left click event sequence:

  • 1 onmousedown - is triggered when the mouse button is initially pressed down.
  • 2 onmouseup - is triggered when the mouse button is released.
  • 3 onclick - is triggered after both mousedown and mouseup events.
  • 4 onmousedown - is triggered when the mouse button is initially pressed down.
  • 5 onmouseup - is triggered when the mouse button is released.
  • 6 onclick - is triggered after both mousedown and mouseup events.
  • 7 ondblclick - is triggered after two complete click sequences within about 300-500 milliseconds.

Right click event sequence:

  • 1 onmousedown - is triggered when the mouse button is initially pressed down.
  • 2 onmouseup - is triggered when the mouse button is released.
  • 3 oncontextmenu - is triggered when the right mouse button is pressed and released.

Mouse movement event sequence:

  • 1 onmouseover - is triggered when the pointer moves over an element or one of its descendants.
  • 2 onmouseenter - is triggered when the pointer enters the element, not its descendants (there is no bubble in the DOM hierarchy).
  • 3 onmousemove - is triggered repeatedly when the pointer moves over an element.
  • 4 onmouseout - is triggered when the pointer moves out of an element or into one of its descendants.
  • 5 onmouseleave - is triggered only when the pointer explicitly leaves the element's bounds, not outside its descendants.

Applies to

This attribute can be used on the following element.

Attribute Element
onmousemove All visible elements