jScrollPane不會坐視下

我在設計的簡單聊天界面中使用jScrollPane作爲滾動條。我在這裏遇到的問題是jScrollPane不會自動滾動到底部。 jScrollPane確實有一個方便的選項'stickToBottom'，我已經設置爲true，並且我已經將'autoReinitalise'設置爲true，因爲內容被動態添加到特定的div中。現在，只要chatbox被填充並且滾動條被添加，我預計jScrollPane會自動滾動到底部並粘在那裏。但事實並非如此。我首先手動滾動到底部，然後它會粘在那裏。所以我嘗試創建一個innerdiv，其高度爲1像素多於它的父級（具有滾動條），以便從頭開始滾動條可見。通過API，然後在Y軸上滾動到100％，這樣滾動手柄完全向下。但是在這種情況下，當我的聊天室被填充並且內容超出可用空間時，滾動條不會粘到底部，它甚至會再次滾動到頂部。jScrollPane不會坐視下

我已經建立了一個非常簡單的testpage有這個問題：

http://www.webtrail.nl/jscrollpane-example

希望有人能幫助我在這裏。謝謝！

來源

2011-12-16 Guido

你能粘貼HTML + CSS + js成jsfiddle？ – alessioalex 2011-12-16 14:08:35

我已更新我的帖子，並鏈接到示例頁面。 – Guido 2011-12-16 17:58:51

你應該有maintainPosition和stickToBottom默認啓用的，但棘手的部分是調用scrollToBottom()只有一次，當內容將完全佔據滾動div的高度，你應該做的，因爲你仍然希望maintainPosition功能工作（因此如果用戶滾動到頂部，即使新內容到達，他也會留在那裏）。

如果您多次撥打scrollToBottom()，則每次都會滾動到底部（從而消除maintainPosition功能）。

如果初始內容大於頁面高度，則可以在頁面加載時調用scrollToBottom，但如果不是，則需要計算內容大小=滾動div高度的時間。

我做了舉例說明本的方法（當我添加24周的div股利需要滾動，所以我叫scrollToBottom則）：

var counter = 1; 
function addDummyContentToChatBox(api) { 
    $("<div>This is some dummy content.</div>").appendTo("#chatbox_inner"); 
    if (counter == 24) { 
     api.scrollToBottom(false); 
    } 
    api.reinitialise(); 
    counter++; 
} 

$(function() { 

    var api = $('#chatbox').jScrollPane({ 
     stickToBottom: true, 
     maintainPosition: true 
    }).data('jsp'); 

    setInterval(function() { 
     addDummyContentToChatBox(api); 
    }, 233); 
});

完整的源：http://jsfiddle.net/STHgr/37/

來源

2011-12-17 09:58:10 alessioalex

jScrollPane不會坐視下

回答

相關問題