Question

我正在构建一个列，其动态内容将附加到列的顶部，类似于TweetDeck的样式。

现在，如果我要在div中间向下滚动以查看内容，则添加到顶部的内容会导致div从滚动位置跳转，如果有大量内容，则列中的任何内容都不可读添加到专栏。

有没有人知道CSS或jQuery的方式是保存用户所在的位置，但仍允许将内容添加到顶部？

很抱歉，我无法提供JS小提琴，数据处于开发环境

更新 - 示例HTML标记

<div class="results" id="results9016">
  <article>
    <img alt="Dave" src="normal.jpg">
    <div class="data">
      <p class="user"><a target="_blank" href="#">dave</a></p>
      <p class="message">Message</p><p class="datetime">24 Apr 17:16:23</p></div>
  </article>
  <article>
    <img alt="Dave" src="normal.jpg">
    <div class="data">
      <p class="user"><a target="_blank" href="#">dave</a></p>
      <p class="message">Message</p><p class="datetime">24 Apr 17:16:23</p></div>
  </article>
  <article>
    <img alt="Dave" src="normal.jpg">
    <div class="data">
      <p class="user"><a target="_blank" href="#">dave</a></p>
      <p class="message">Message</p><p class="datetime">24 Apr 17:16:23</p></div>
  </article>
</div>

使用jQuery .prepend（）;

添加每个article元素

提前致谢

Answer 1

尝试在前置之前缓存文档的滚动位置，然后立即重置：

var addTweet = function() {
    var scrollPosition = $(document).scrollTop();
    $('#results9016').prepend($newTweet);
    $('html, body').scrollTop(scrollPosition);
}

Here's a fiddle of it in action.注意：根据您的代码，您可能希望滚动容器而不是整个文档。

保留滚动分区的阅读位置

1 个答案: