JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.github.com/brandonaaron/jquery-mousewheel/master/jquery.mousewheel.js"></script>
<div id="my_elem" style="width:200px;height:200px;background:red;"></div>
Note: Firefox (7.0.1 at least) triggers twice because it supports both mousewheel and DOMMouseScroll.

JavaScript

// Bind both mousewheel events, to support multiple browsers
$('#my_elem').bind('DOMMouseScroll mousewheel', function(e, delta) {
    // Show browser properties
    console.log(delta + ' | ' + 
                e.detail*(-1) + ' | ' +
                e.wheelDelta);
    
    // Create normalized variable: 1 for scroll up, -1 for scroll down
    var norm = (delta || e.detail*(-1) || e.wheelDelta);
    if(norm > 0) norm = 1;
    else if(norm < 0) norm = -1;
    // else: 0 (unlikely) or undefined (JS error)
    console.log("Normalized: "+ norm);
});