Question

我想反复滚动到页面底部并每40ms备份一次。

$("html, body").animate({ scrollTop: $(document).height() }, 400);
setTimeout(function() {
   $('html, body').animate({scrollTop:0}, 400); 
},400);
setInterval(function(){
$("html, body").animate({ scrollTop: $(document).height() }, 400);
setTimeout(function() {
   $('html, body').animate({scrollTop:0}, 400); 
},40);

},80);

到目前为止一切顺利。唯一的问题是，我要滚动的页面使用无限滚动，即每次滚动到页面底部时，页面高度（$(document).height()）都会发生变化。因此，它不是滚动整个页面，而是滚动与页面原始高度相同的距离。

脚本的目的是在将页面滚动到最底部之后获取页面的全部内容（即再次滚动它的次数不会再增加页面的内容）。 如何修改此脚本，以便每次页面高度增加时滚动到页面的最底部？

Answer 1

您是否考虑过使用此类代码

$(document).height() - win.height() == win.scrollTop())

或

$(window).scroll(function () { 
   if ($(window).scrollTop() >= $(document).height() - $(window).height() - 10) {
      //Add something at the end of the page
   }
});

Answer 2

这是你可以尝试的东西我没有测试它...我只是这样写的。

要在加载时初始化它，它需要在两个Height_变量中有两个不同的值。

动画上下也有延迟...
这些可以随意缩短。

让无限滚动功能加载新内容会有延迟这个需要明智地调整。

应该有效......

var Height_actual=1;
var Height_mem=0;

var animateDelay_down=400;
var animateDelay_up=400;
var infiniteDelay_load=800;

function forceInfinite(){

    // Force infinite scroll to load all it's content
    // IF the last known height is NOT the same as the actual.
    if(Height_actual!=Height_mem){

        // Keep the actual height in "memory" for the next iteration.
        Height_mem=$(document).height();

        // Going to the bottom
        $("html, body").animate({ scrollTop: actualHeight }, animateDelay_down);

        // At the end of the animation
        // PLUS a delay for the infinite scroll to load the new content.
        setTimeout(function() {
            // Possibly a new height to keep in "memory".
            Height_actual=$(document).height();

            // OK, going back to top
            $('html, body').animate({scrollTop:0}, animateDelay_up);

        },animateDelay_down+infiniteDelay_load);

        // Restart the function after all delays.
        setTimeout(function() {
            forceInfinite();
        },animateDelay_down+infiniteDelay_load+animateDelay_up);
    }
}

// Init
forceInfinite();

用jquery重复滚动无限滚动页面

2 个答案: