The HTML onmouseup attribute is an event handler that triggers a script to execute when the mouse button is released over a specific element.
Definition and Usage
➔ The sequence of related mouse events is usually onmousedown, then onmouseup, and then click.
➔ Whether the button is pressed inside the element (onmousedown) or not, the onmouseup event remains active as long as the release is over the element.
Syntax
//In HTML
<input type="text" onmouseover="myFunction()">
// In Javascript object
object.onmouseover =function() {myHandler()};
// In Javascript object
object.onmouseover = (event) => {
//alert("mouseover"); //or
myFunction();
};
// Using EventListener function run on event
document.querySelector("#id").addEventListener("mouseover", myFunction);
// Using EventListener
object.addEventListener("mouseover", (event) => {
myFunction();
});
//Or
document.querySelector("#id").addEventListener("mouseover",()=>{
//alert("mouseover");
myFunction();
});
function myFunction(){
alert("mouseover");
}
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 (bubble in the DOM hierarchy, see opposite onmouseout).
- 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 (there is no bubble in the DOM hierarchy).
- 5 onmouseleave - is triggered only when the pointer explicitly leaves the element's bounds, not outside its descendants (bubble in the DOM hierarchy, see opposite onmouseenter).
Applies to
This attribute can be used on the following element.
| Attribute | Element |
|---|---|
| onmouseup | All visible elements |