JSFiddle - React, Tailwind, and code Playground

HTML

<div class="rect"></div>
<div>
    Mousewheel event state : 
    <label class="event-state-mousewheel">Triggered !</label>
</div>

CSS

.rect {
    width : 200px;
    height : 200px;
    background-color : lightgrey;
}

.event-state-mousewheel {
    color : red;
    display : none;
}

JavaScript

$(function() {
	$('.rect').on('mousewheel', function(event) {
        if (event.originalEvent.wheelDelta > 0 || event.originalEvent.detail < 0) {
        alert('up');
        }
        else {
            alert('down');
		}
		$(".event-state-mousewheel").stop(true, false).fadeIn(250).fadeOut(250);
	});
});