Pseudo-Continuous Scrolling

I would like to display a large number of results without multiple "pages" to load results "0-99" on page 1, "100-199" on page 2, "200-299" on page 3 etc.

Thus my idea is to create a sort of pseudo-continuous scrollable data list. So essentially,开发者_C百科 data would be loaded as necessary but only if scrolled to. The box of data would then would have need to have a logical sort of scrollbar (I'm not sure how I would do that at this point - perhaps just with arrows). Also, if massive amounts of data are loaded then I imagine that old data would need to be cleared from memory so as not to kill a browser. How would one do all this in a web interface using jquery (or any javascript) on the client side and php

Ben Nadel did something quite similar on his blog (admittedly in CF, not PHP, but the server-side code is really short) using JQuery.

http://www.bennadel.com/blog/1803-Creating-A-Bidirectional-Infinite-Scroll-Page-With-jQuery-And-ColdFusion.htm

The nice thing about Ben's implementation is that it clears stuff you scroll past... meaning you don't run into that infinite DOM problem.

well it will probably get rather complex when you get into it but basically something like this...:

// PSEUDO CODE
$(document).ready(function(){
  $('#datascroller').scroll(function(){
      var tbl = $('table', this);
      var $this = $(this);
      if($('td:last', tbl).scrollTop() == tbl.height()*-1)
      {
         //clear current data and display loading animation
         tbl.fadeOut('fast', function(){
            $(this).replaceWith(loadingAnimationElement.hide());
            loadingAnimationElement.fadeIn('fast');
            $.get('/phpscript.php', {page: 2}, function(results){
               var $data = $(results).hide();
               loadingAnimationElement.fadeOut('fast', function(){
                  $(this).replaceWith($data);
                  $data.fadeIn('fast');
               })
            });
         });
      }
  });
});

You mean something like SortFolio? You can bind to the scroll event with jQuery just like any other. You'd then be looking at a series of xml get requests to bring in data, and either append or prepend the list, depending on if the scrolling went up or down.

jQuery Tools has a demo of their Scrollable widget that sounds kind of like what you're describing.