How to Execute a JavaScript when releasing a mouse button over a paragraph
Click the text! The mouseDown() function is triggered when the mouse button is pressed down over this paragraph. The function sets the color of the text to red. The mouseUp() function is triggered when the mouse button is released. The mouseUp() function sets the color of the text to green.
index.html
Example:
HTML
<!DOCTYPE html>
<html>
<body>
<p id="p1" onmousedown="mouseDown()" onmouseup="mouseUp()">
Click the text! The mouseDown() function is triggered when the mouse button is pressed down over this paragraph. The function sets the color of the text to red. The mouseUp() function is triggered when the mouse button is released. The mouseUp() function sets the color of the text to green.
</p>
<script>
function mouseDown() {
document.getElementById("p1").style.color = "red";
}
function mouseUp() {
document.getElementById("p1").style.color = "green";
}
</script>
</body>
</html>
Output should be:
| Example of HTML onmouseup Event Attribute | Mouse Events Attribute |
| Definition and Usage of HTML onmouseup Event Attribute | Mouse Events Attribute |
| Browser Support of HTML onmouseup Event Attribute | Mouse Events Attribute |
| Syntax of HTML onmouseup Event Attribute | Mouse Events Attribute |
| Attribute Values of HTML onmouseup Event Attribute | Mouse Events Attribute |
| Technical Details of HTML onmouseup Event Attribute | Mouse Events Attribute |
| How to Execute a JavaScript when releasing a mouse button over a paragraph | Mouse Events Attribute |
| List of Mouse Events Attribute | Mouse Events Attribute |
| What is HTML onclick Event Attribute | Mouse Events Attribute |
| What is HTML ondblclick Event Attribute | Mouse Events Attribute |
| What is HTML onmousedown Event Attribute | Mouse Events Attribute |
| What is HTML onmousemove Event Attribute | Mouse Events Attribute |
| What is HTML onmouseout Event Attribute | Mouse Events Attribute |
| What is HTML onmouseover Event Attribute | Mouse Events Attribute |
| What is HTML onmouseup Event Attribute | Mouse Events Attribute |
| What is HTML onwheel Event Attribute | Mouse Events Attribute |
Type: | Html |
Category: | Web Tutorial |
Sub Category: | Mouse Events Attribute |
Uploaded by: | Admin |