JavaScript DOM WheelEvent property: deltaZ
[this page | pdf | back links]
The deltaZ property of WheelEvent
objects within the JavaScript
DOM returns the
z-axis scroll amount of a mouse wheel.
EXAMPLE:
HTML USED IN THIS EXAMPLE:
<!DOCTYPE html>
<html> <!-- Copyright (c) Nematrian Limited 2018 -->
<head></head>
<body>
Try moving wheel to see impact of a wheel event
(note: support for touch events, especially ones other than touchstart is complex and seems to vary by browser):
<p id="element" style="background-color: yellow; border: 2px solid black; width: 200px; height: 80px;"><br><br></p>
<em>TouchEvent outcomes are:</em><br>
deltaMode: <b id="wheel1"></b><br>
deltaX: <b id="wheel2"></b><br>
deltaY: <b id="wheel3"></b><br>
deltaZ: <b id="wheel4"></b><br>
<script>
var x = document.getElementById("element");
x.addEventListener("wheel", mywheel, false);
function mywheel(event) {
document.getElementById("wheel1").innerHTML = event.deltaMode;
document.getElementById("wheel2").innerHTML = event.deltaX;
document.getElementById("wheel3").innerHTML = event.deltaY;
document.getElementById("wheel4").innerHTML = event.deltaZ;
}
</script>
</body>
</html>
|
NAVIGATION LINKS
Contents | Prev | Next | JavaScript DOM (and BOM)