<!DOCTYPE html>
<html>
<body>
<h1>WheelEvent deltaY Property</h1>
<p>Resize the DIV element by scrolling inside it:</p>
<div onwheel="myFunction(event)" style="width:100px;height:100px;background-color:Tomato"></div>
<script>
function myFunction(event) {
var y = event.deltaY;
var currentSize = event.target.style.width;
if (y > 0) {
newSize = parseInt(currentSize) + 10;
} else {
newSize = parseInt(currentSize) - 10;
}
event.target.style.width = newSize + "px";
event.target.style.height = newSize + "px";
}
</script>
</body>
</html>