Determine how many times the mouse wheel was rotated, not the length it rotated
I want to make the div scroll for the number of wheel rotations, not the length that the wheel spins. Is it possible?
eg. If the user spins the length of the mouse wheel, I need to pass the value 10. Also, if the user spins the length of the mouse wheel x / 4, I still need to pass the value 10.
example :: something like this - every time it rotates, the value only increases by 1.
var i = 0;
$("#divD").on('scroll', function() {
i++;
});
If you want to differentiate between separate continuous scrolling and not count the scrolling duration, you can unbind
mousewheel
try again after the delay. Expanding on @ wrxsti's solution, it looks like this:
var i = 0;
var u = 0;
var d = 0;
$(document).bind('mousewheel', updateValues)
function updateValues(e){
i++;
$('#all').text(i);
if(e.originalEvent.wheelDelta > 0) {
u++;
$('#up').text(u);
} else {
d++;
$('#down').text(d);
}
$(document).unbind('mousewheel');
setTimeout(function(){$(document).bind('mousewheel', updateValues)}, 500);
};
http://jsfiddle.net/g6enbeq2/2/
Something like this might work for your purposes. Try to bind the mouse wheel.
var i = 0;
$(document).bind('mousewheel', function(){
i++;
$('div').text(i);
});
DEMO
Also, if you want to take it even further, you can define the scroll direction.
var i = 0;
var u = 0;
var d = 0;
$(document).bind('mousewheel', function(e){
i++;
$('#all').text(i);
if(e.originalEvent.wheelDelta > 0) {
u++;
$('#up').text(u);
} else {
d++;
$('#down').text(d);
}
});
DEMO