JSFiddle - React, Tailwind, and code Playground

by TRNCFRMCN

HTML

<div style="height:200px;width:200px;display:inline-block;overflow:auto">
    <div style="height:1000px;width:200px;display:inline-block;background:grey;"></div>
</div>
<div style="display:inline-block">
    mousewheel:<span class="mousewheel"></span><br>
    scroll:<span class="scroll"></span>

JavaScript

var a = [];
var b = [];
var timer;
var timer2;
$('div').eq(0).on('scroll', function() {
    clearTimeout(timer);
    a.push(Date.now());
    $('.scroll').text(((a[a.length-1]-a[0])/a.length).toFixed(2));
    timer = setTimeout(function() { a = [] } , 200 )
})

$('div').eq(0).on('mousewheel', function() {
    clearTimeout(timer2);
    b.push(Date.now());
    $('.mousewheel').text(((b[b.length-1]-b[0])/b.length).toFixed(2));
    timer2 = setTimeout(function() { b = [] } , 200 )
})