HTML Event attribute: onwheel
[this page | pdf | back links]
The HTML onwheel attribute specifies the event
that is triggered when the mouse wheel rolls up or down over an element. It
applies to all visible elements. It currently is not supported by all major
browsers.
EXAMPLE:
HTML USED IN THIS EXAMPLE:
<!DOCTYPE html>
<html> <!-- Copyright (c) Nematrian Limited 2018 -->
<head></head>
<body>
onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseover, onmouseup, onmousewheel, onwheel:<br>
try moving mouse across, or using scroll and clicking on and off this
<span style="background-color: yellow;"
onmousedown="myOnmousedown()"
onmouseenter="myOnmouseenter()"
onmouseleave="myOnmouseleave()"
onmousemove="myOnmousemove()"
onmouseover="myOnmouseover()"
onmouseup="myOnmouseup()"
onmousewheel="myOnmousewheel()"
onwheel="myOnwheel()"
>element</span>
<br><br>
Mouse down: <b id="mouse1"></b><br>
Mouse enter: <b id="mouse2"></b><br>
Mouse leave: <b id="mouse3"></b><br>
Mouse move: <b id="mouse4"></b><br>
Mouse over: <b id="mouse5"></b><br>
Mouse up: <b id="mouse6"></b><br>
Mouse wheel: <b id="mouse7"></b><br>
Wheel: <b id="mouse8"></b><br>
<script>
function myOnmousedown() {document.getElementById("mouse1").innerHTML = "Yes";}
function myOnmouseenter() {document.getElementById("mouse2").innerHTML = "Yes";}
function myOnmouseleave() {document.getElementById("mouse3").innerHTML = "Yes";}
function myOnmousemove() {document.getElementById("mouse4").innerHTML = "Yes";}
function myOnmouseover() {document.getElementById("mouse5").innerHTML = "Yes";}
function myOnmouseup() {document.getElementById("mouse6").innerHTML = "Yes";}
function myOnmousewheel() {document.getElementById("mouse7").innerHTML = "Yes";}
function myOnwheel() {document.getElementById("mouse8").innerHTML = "Yes";}
</script>
</body>
</html>
|
NAVIGATION LINKS
Contents | Prev | Next | HTML Attributes