Lazy Loading: How to create a lazy loading html page using jquery

$(window).on( "scroll" , function() {

     var $document = $(document);
     var $window = $(this);

     if( $document.scrollTop() >= $document.height() - $window.height() - 400 ) {
         // do something
     }

 });

Where 400 is your offset from the bottom of the page. There are plugins that do this but this is some simple code to do it. I recommend using underscorejs to throttle this function because this function will fire every time the scroll top changes. So for every pixel it will trigger. Generally I throttle it to only run every 60 frames per second.

There is a Lazy Load Plugin for jQuery if you want to try that:

http://www.appelsiini.net/projects/lazyload