How to create an Infinite Scroll using jQuery?

Question

$( "body").scroll( function() {
   $( "#myDiv").load( "test.html");
});

With this syntax we can load content into a div when the user scrolls. But before inserting into the div I want to make sure that div is in the viewport area when the user scrolls down.

If yes then I would like to load external content into that div. Please help me to achieve my goal.

Answer 1

  $( "body").scroll( function() { 
    if (document.elementFromPoint(x,y) == $("#whatever")) { 
      $( "#myDiv").load( "test.html");
    }
  }