使一個可滾動的元素停留在「底部」，同時添加內容

我正在爲我正在創建的Web應用程序構建一個實用程序頁面。我有一個我想用作「控制檯」的元素。使一個可滾動的元素停留在「底部」，同時添加內容

我通過Ajax調用（使用原型的Ajax.PeriodicalUpdater）獲取控制檯的條目。

我遇到的問題是，當我將新行插入到「控制檯」底部時，滾動條會保持在初始位置（所以除非手動向下滾動，否則始終會看到頂部行）。

如何讓滾動條自動停留在底部？

我在這個項目中使用了一些需要它的庫的原型，所以如果可能的話我寧願堅持使用那個或者常規的javascript。

正如一個音符，我已經嘗試過這樣的：

onComplete: function() { 
    $('console').scrollTop = $('console').scrollHeight; 
}

它幾乎的作品，但它始終是「一步落後」，我不能看到最近的項目。

來源

2008-10-30 TM.

new Ajax.PeriodicalUpdater(container, url, { 
    onComplete: function() { 
     (function() { 
      container.scrollTop = container.scrollHeight; 
     }).defer(); 
    } 
});

來源

2008-10-30 05:27:15 eyelidlessness

謝謝，我其實已經嘗試過這種方法，但總是落後一步。換句話說，我仍然無法看到最近添加的內容，直到下一個東西被添加。 – 2008-10-30 05:30:20

請參閱編輯。這有什麼區別嗎？ – eyelidlessness 2008-10-30 05:39:07

嘿，我正在構建幾乎完全相同的東西（一個Ajax控制檯），並且遇到了溢出的div沒有一直拖到底部的問題。

和堆棧溢出幫助我解決它！希望它也能幫助你！

Scrolling Overflowed DIVs with JavaScript

編輯：我的問題使用jQuery的，但問題是不與JS框架將其與CSS的屬性你使用。基本上你需要得到Math.max（div.scrollHeight，div.clientHeight），因爲有些瀏覽器與這些屬性有點兒差錯。

來源

2008-10-30 05:56:47

使一個可滾動的元素停留在「底部」，同時添加內容

回答

相關問題