Calculating end of scroll on a web page

Question

I need to calculate the end of scrolling on web page so that i can make an Ajax call. I have searched posts in stackoverflow, but the solutions didn't worked for me.

I am using the below code ion order to determine that:

$(window).scrollTop() == $(document).height() - $(window).height()

but the above condition fails and am not able to get to know when page scroll ends.

As the values don't match on L.H.S and R.H.S the condition fails. Just in order to check i used:

$(window).scrollTop() == $(document).height() - $(window).height() - 13

which works for chrome and firefox but fails for IE. I need a concrete solution and don't want to hard code values. Please help me in getting it right.

EDIT: To be specific, i am trying to calculate the end of vertical scroll bar.

Answer 1

Here is what I would do:

$(window).on('scroll', function() {
if($(window).scrollTop() != 0)
{    
    if( $(window).height() + $(window).scrollTop() >= $(document).height() )
    {
    //YES, I AM EXACTLY AT THE END OF THE SCROLL, PLZ FIRE AJAX NOW
    }
}
});

CAUTION: Be very careful about having negative top margins though for styles in any of your elements on the page!! it may offset the calculation!

Answer 2

to calculate the end of scroll, try scrollHeight property.