Question

I’m trying to do pagination scrolling the same as this tutorial , and while I use

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

It is not working, it doen’t show any action. So I searched and found one solution :

 if($(window).scrollTop() + $(window).height() >= $("#productlist").height()) {

Note : #productlist is the id of my container div.

But when I do this, my page always appends data whenever I scroll my mouse. What I want is, loading the new contents only when the scroll bar is at the bottom of the page like the facebook or twitter paging loading.

Could any one show me, how could I deal with that problem?

Thanks.

Answer 1

 $('#yourcontainerId').bind('scroll', function(){

  if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight)  {
    alert('this will alert only when it reaches the end');
  }
});