Infinite Scroll images Like Bing and Google

One of the must annoying thing when working with large data is how to loading this data to your page?The common solution is paging but paging itself will not help too much you can end with hundred or thousands of page numbers.So new solution now is on the surface and it's called

 
 
 
 
 
4.3 Star
(19)
52,154 times
Add to favorites
3/16/2012
E-mail Twitter del.icio.us Digg Facebook

Solution explorer

JavaScript

        
        $(document).ready(function () {
            var Skip = 49; //Number of skipped row
            var Take = 14; //
            function Load(Skip, Take) {
                $('#divPostsLoader').html('<img src="ProgressBar/ajax-loader.gif">');

                //send a query to server side to present new content
                $.ajax({
                    type: "POST",
                    url: "GridVB.aspx/LoadImages",
                    data: "{ Skip:" + Skip + ", Take:" + Take + " }",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {

                        if (data != "") {
                            $('.thumb').append(data.d);
                        }
                        $('#divPostsLoader').empty();
                    }

                })
            };
            //Larger thumbnail preview 

            //When scroll down, the scroller is at the bottom with the function below and fire the lastPostFunc function
            $(window).scroll(function () {

                if ($(window).scrollTop() == $(document).height() - $(window).height()) {
                    Load(Skip, Take);


                    Skip = Skip + 14;
                }
            });
        });