在頁面中創建一個無止境的可滾動div

Question

我想在我的頁面中創建一個無止境的可滾動div。要做到這一點，我嘗試使用下面的代碼 - >http://jsfiddle.net/cyrus2013/Qq85d/

$(document).ready(function(){ 

function lastAddedLiveFunc() 
{ 
    $('div#lastPostsLoader').html('<img src="../bigLoader.gif">'); 

    $.get("loadmore.php", function(data){ 
     if (data != "") { 
      //console.log('add data..'); 
      $(".items").append(data); 
     } 
     $('div#lastPostsLoader').empty(); 
    }); 
}; 

// lastAddedLiveFunc（）; $（窗口）.scroll（函數（）{

var wintop = $(window).scrollTop(), docheight = $(document).height(), winheight = $(window).height(); 
    var scrolltrigger = 0.95; 

    if ((wintop/(docheight-winheight)) > scrolltrigger) { 
    //console.log('scroll bottom'); 
    lastAddedLiveFunc(); 
    } 

}）; }）;

但是，這裏的代碼是爲整個頁面（窗口）創建相同的，因爲我需要爲網頁中的特定「div」創建它。

在這部分的頁面中，我很難弄清'div'的尺寸。

var wintop = $(window).scrollTop(), docheight = $(document).height(), winheight = $(window).height(); 
     var scrolltrigger = 0.95; 

類似的事情會在Facebook上的頁面，這可以告訴我們的朋友進行實時做的右側的「北京時間」一節。

請幫我弄清楚這個要求的代碼...在此先感謝！

Answer 1

這個怎麼樣（該randomPara的東西是存在的只有模擬內容）：

DEMO

var scroller; 
var initContents = 10; 
var shown = 0; 
var content = []; 

function init(){ 
var scroller = document.getElementById('scroller'); 
for(var i=0;i<100;i++){ 
    var randomPara = ""; 
    var words = Math.floor(Math.random()*100); 
    for(var j=0;j<words;j++) randomPara += "word "; 
    content.push(randomPara+"<br>"); 
} 
for(var i=0;i<initContents;i++){ 
    scroller.innerHTML += content[shown]; 
    shown++; 
} 
scroller.onscroll = function(){ 
    if(shown < content.length) if(this.scrollTop >= this.scrollHeight-this.clientHeight) 
    scroller.innerHTML += content[shown]; 
    shown++; 
} 
}