具有无限滚动循环的自动滚动 jquery答案

【问题标题】：autoscroll jquery with infinite scroll loop具有无限滚动循环的自动滚动 jquery
【发布时间】：2017-08-17 03:50:06
【问题描述】：

我有一个页面，我想让它在整个页面加载后自动滚动，滚动到底部并基本上自动循环到页面的开头（基本上是在它下面加载相同的页面）以使它是一个无限循环。我有以下脚本可以执行此操作，但在顶部/底部滚动几次后它会中断。到目前为止，我正在使用 jQuery 来提供帮助。我在另一个 StackOverflow 帖子上找到了这个 sn-p，但找不到它。

function scroll(element, speed) {
        element.animate({ scrollTop: $(document).height() }, speed,'linear', function() {
                $(this).animate({ scrollTop: 0 }, 3000, scroll(element, 4000));
        });
}
setTimeout(function() {
    scroll($('html, body'), 900000)
}, 3000);

【问题讨论】：

标签： javascript jquery infinite-loop infinite-scroll autoscroll

【解决方案1】：

我能够使用更简单的方法解决它：

window.onload = function () {
    var Delay = $(document).height() * 65;
    var DelayBack = $(document).height() * 5;
    function animateBox() {
        $('html, body')
        .animate({scrollTop: $(document).height()}, Delay, 'linear')
        .animate({scrollTop: 0}, DelayBack, animateBox);
    }
    setInterval(animateBox, 100);
}

【讨论】：

【解决方案2】：

我觉得你的问题与这条线有关......

$(this).animate({ scrollTop: 0 }, 3000, scroll(element, 4000));

尝试将其更改为以下内容以使其成为回调而不是立即调用：

$(this).animate({ scrollTop: 0 }, 3000, function(){ scroll(element, 4000); });

【讨论】：

【解决方案3】：

使用 php 和 ajax 获取数据将滚动功能应用于窗口事件

$(document).ready(function(){
    $(window).scroll(function(){
        var lastID = $('.load-more').attr('lastID');
        if ($(window).scrollTop() == $(document).height() - $(window).height() && lastID != 0){
            $.ajax({
                type:'POST',
                url:'getdata.php',
                data:'id='+lastID,
                beforeSend:function(html){
                    $('.load-more').show();
                },
                success:function(html){
                    $('.load-more').remove();
                    $('#postList').append(html);
                }
            });
        }
    });
});

【讨论】：

这似乎比应有的复杂。这只是一个带有 jquery 的简单 html 页面。