jQuery prepend - 阻止自动滚动

Question

我刚刚使用jQuery prepend,无法按预期工作.

我在做什么:

每隔一秒将.contentdiv添加到#maindiv

但是,当我向下滚动[一旦页面内容充满]时,我会继续滚动回到#main顶部或最新的前置.content

我如何能:

防止viewport变化 - 就像追加一样

相关小提琴

Answer 1

正如我在评论中解释的那样,滚动实际上并没有改变.窗口的滚动基于"距离顶部的距离"(DfT).也就是说,如果你没有滚动条,那么你的DfT就是0.一旦引入了滚动条,你就可以有一段距离了.

因为内容越来越长,视口只有很多像素高,一些内容"掉落"在页面的底部(前置是使DfT偏离新元素的高度).

我能想到的最好方法是用新元素的高度来对抗它.这允许您滚动到某个位置,然后在添加新元素时相应地修改滚动位置.

这是我的意思的一个例子:http://jsfiddle.net/bradchristie/66RvC/1/

和代码(供参考):

var f = function(){
    var t = $(window).scrollTop(),      // Window's current scroll position
        $d = $(d()).prependTo('#main'), // store the new element
        h = $d.outerHeight();           // also get its height
    if (t){                             // Only adjust if they've scrolled
        $(window).scrollTop(t + h);     // add the delta to the scroll position
    }
    setTimeout( f, 1000 );
};