jquery - jquery scroll function issue in webkit

Question

This fires a jquery function when the page is 300px from the bottom, works fine in firefox but in webkit browsers like chrome, it fires after scrolling even 1 pixel.

$(document).ready(function() {
    var timeout = '';

    var $scollEl=$('body').scroll(function (e) { 
        var intBottomMargin = 500; 
        clearTimeout(timeout);
        //if less than intBottomMargin px from bottom 

        if ($scollEl.scrollTop() >= $(document).height() - $scollEl.height() - intBottomMargin) {
          timeout = setTimeout(function(){ 
                $("#next-paginav")[0].click(); 
          }, 300);
        }
    });
});

Here's a jsfiddle of the code. http://jsfiddle.net/LnmsR/2/

Try in chrome - fires immediately, then in firefox it fires at the bottom, like it should. What exactly is the bug here and does anyone know how to make this work in webkit?

Answer 1

I use this code

$(window).scroll(function() {
    if ($(document).height()-$(window).height()-$(window).scrollTop() < 300) {
        // your code
    });
});