jQuery load more data on scroll

Question

I am just wondering how can i implement more data on scroll only if the div.loading is visible.

Usually we look for page height and scroll height, to see if we need

Answer 1

I suggest using more Math.ceil for avoid error on some screen.
Because on a few different screens it's not absolutely accurate
I realized that when I console.log.

console.log($(window).scrollTop()); //5659.20123123890  

And

console.log$(document).height() - $(window).height()); // 5660

So I think we should edit your code to

$(window).scroll(function() {
    if(Math.ceil($(window).scrollTop()) 
       == Math.ceil(($(document).height() - $(window).height()))) {
           // ajax call get data from server and append to the div
    }
});

Or Allow load data from server before scroll until bottom.

if ($(window).scrollTop() >= ($(document).height() - $(window).height() - 200)) {
 // Load data
}