jquery Scroll event in $(window), find out the position difference

Question

I'm using:

$(window).scroll(function(e){
.....
});

How can i find out the number of pixels (and the direction, if absolute number) that were scrolled?

Thanx

Answer 1

Here is one way:

jQuery(function($) {
    var lastScroll = document.body.scrollTop;
    $(window).scroll(function(e) {
        var newScroll = document.body.scrollTop;
        console.log(newScroll - lastScroll);
        lastScroll = newScroll;
    });
});

Answer 2

Use scrollTop to determine what you're looking for.

Answer 3

The line below doesn't work on Firefox 19 (which I updated this year: 2013).

var lastScroll = document.body.scrollTop;

The solution, which will also improve the cross browser compatibility, is to use a jQuery call:

var lastScroll = $(document).scrollTop();

Final result:

$(function(){
    var lastScroll = $(document).scrollTop();
    $(window).scroll(function(e) {
        var newScroll = $(document).scrollTop();
        console.log(newScroll - lastScroll);
        lastScroll = newScroll;
    });
});

Enjoy!