溢出：隱藏，但讓內容自動滾動

Question

我有一個div，其中內容通過查詢的append()定期附加到它。 隨着內容越來越長，它最終將溢出div。 我不希望在溢出時沒有滾動條出現，但仍使內容向上滾動以在下面顯示新內容。

這可能嗎？ 當我使用overflow-x: hidden不會出現滾動條，但隱藏了內容。

Answer 1

如果容器的大小是固定的，則可以將內容放置在絕對定位的包裝中，如下所示：

<div class="container">
    <div class="wrap">
        <p>bah</p>
    </div>
</div>

和css：

.container {
    y-overflow: hidden;
    position: relative;
    height: 200px;
    width: 200px;
}

.wrap {position:absolute; bottom: 0; left:0;right:0;
}

http://jsfiddle.net/sXGd9/

Answer 2

append()將添加到內容的末尾。 您可能希望prepend()新內容，以便在舊內容之前添加數據。

至於overflow ，您可以將其設置為scroll以便在必要時顯示滾動條，或者hidden這樣就不會出現滾動條但內容將不可見。 否則，您可以將其設置為visible以便它可見但滾動條不會出現。

您希望溢出的內容可見嗎？ 如果是這樣設置overflow: visible否則設置overflow: hidden （因為你不想要滾動條）。 無論如何，你無法滾動內容。 如果需要滾動，則必須構建自己的滾動系統，將事件處理程序添加到容器中。

Answer 3

如果你的“#container”div中的每個附加內容都包含在一個單獨的“.append”div中，你可以執行以下操作：

var pos = $('#container div:last').position();
$('#container').scrollTop(pos.top);

這有用嗎？

其他解決方案可以在之前的帖子中找到： 如何使用jQuery將表的一行滾動到視圖（element.scrollintoView）？