How to find out the end of a scroll event for a <div> tag

Question

I need to call a function if the end of the scroll has reached the div tag.

    $("#page").bind("scroll",function(e){ //page is the ID of the div im scrolling
          if (document.body.scrollHeight - $(this).scrollTop()  <= $(this).height())
          {
             //the code here is called every time the scroll is happened i want to call     
             //this only when the scroll reaches the end of div
          }   
    });

Answer 1

$("#page").scroll( function() {
  if($(this)[0].scrollHeight - $(this).scrollTop() == $(this).outerHeight()) {
   // what you want to do ...
  }
});

Answer 2

$("#page").bind("scroll",function(e){ //page is the ID of the div im scrolling

      if ( ( $(this).height() + $(this).scrollTop() ) => $(this).innerHeight() )
      {
         //Test it first without padding. Then see if you need to tweak the left part of the condition
      }   
});

Answer 3

The following code worked for me

$("#page").scroll( function() {
    if($(this).scrollTop() >= ($(this)[0].scrollHeight - $(this).outerHeight())) 
    {
        alert("End here");
    }
});