Javascript 如何在Jquery和bootstrap中创建自动滚动页面

我想在这个链接中使用这个滚动导航

对于滚动页面，它需要点击链接，但我希望这是自动完成，而不需要点击链接

有人能帮我指出下面代码段中的错误吗

//jQuery for page scrolling feature - requires jQuery Easing plugin
$(function() {
    $('a.page-scroll').bind('click', function(event) {
        var $anchor = $(this);
        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top
        }, 1500, 'easeInOutExpo');
        event.preventDefault();
    });
})

---

在我的项目中，没有任何鼠标可以点击，我需要3个不同数据的单独页面，我想动态显示这些数据，例如10秒显示第一页，然后滚动或移动到下一页，然后，不停止。

只需将animate函数移出事件侦听器（但在jQuery的document ready函数中），它就可以在不需要单击的情况下执行

$(function() {
    $('html, body').stop().animate({
        scrollTop: $($('a.page-scroll').eq(2).attr('href')).offset().top
    }, 1500, 'easeInOutExpo');
});

你可以直接在你帖子的链接中，在控制台中尝试

注意：我添加了

.eq（2）

以获取文章中链接的第二个按钮的href。

带有无限循环的自动滚动页面

调用另一个函数以在特定时间段后执行。这些调用的循环可以通过

clearTimeout

函数停止

根据滚动位置自动更改活动导航栏项目

现在页面会根据无限循环自动滚动。但是用户可以通过页面末尾的链接停止它

/**AutoScroll+ScrollSpy****
var校正=50；//导航栏的高度
//不要忘记设置标记的数据偏移量属性
var延迟_读数=4000；//4秒=4000；10秒=10000
变量延迟_滚动=1500；
变量链接=[“#区段开始”、“#区段绿色”、“#区段蓝色”、“#区段红色”、“#区段停止”]；
var-timerId=0；
延迟链接（0）；
$（“#节停止a”）。单击（函数（事件）{
event.preventDefault（）；
清除超时（timerId）；
});
$（“#导航栏-1 li a”）。单击（函数（事件）{
event.preventDefault（）；
scrollToLink（$（this.attr（'href'））；
});
功能链接（一）{
如果（i>=links.length）i=0；
滚动链接（链接[i]）；
var next=（i==links.length-1？0:i+1）；
timerId=setTimeout（函数（）{delayLinks（next）}，延迟读取）；
}
函数scrollToLink（链接）{
选择链接=$（链接）；
如果（选择link.length）{
var top=selectLink.offset（）.top-CORRECTION；
$（'body，html'）.stop（）.animate（{scrollTop:top}，延迟滚动）；
}否则{
colsole.log（'未找到链接：'+link）；
}
}

@导入url（'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css');
身体{
填充顶部：50px；
}
#绿色部分，
#蓝色部分，
#红色部分，
#第一节开始，
#区段停止{
高度：800px；
填充：10px 20px；
}
#绿色部分{背景：#9c6；颜色：#cf9；}
#蓝色部分{背景：#69c；颜色：#9cf；}
#红色部分{背景：#c69；颜色：#f9c；}

切换导航







请稍等几秒钟
绿色
蓝色
红色

无需单击？什么意思？在

悬停

？事实上，我想当网站打开时，页面会自动滚动，因为在我的项目中，没有任何鼠标可以点击它，它只工作了一次，并且只对linke 2工作，有没有办法使它循环？我的意思是没有stop@Mom你的意思是自动从页面顶部滚动到页面末尾？是的，没错，例如循环从第1页滚动到第3页，并且没有任何停止，实际上每个页面中的几秒钟延迟将使用相同的功能，但更改获取href的锚点。也可以使用settimeout在页面中停止。对不起，我没有时间写这些。你自己试试，如果你有更多的问题就回来（发布另一个问题，我想这个问题已经解决了）。@妈妈，你是什么意思？当我点击菜单项时，页面平滑地滚动到所需的块。在我的项目中，没有任何鼠标可点击，我需要3个不同数据的单独页面，我想动态显示这些数据，例如10秒显示第一页，然后滚动或移动到下一页，然后，没有stoppage@Mom我已经添加了autoscroll。请再次检查我的答案。非常感谢您的帮助，它工作正常，但是否可以删除“按以再次重复”并使其循环，我不希望它停止。对不起，我不知道javascript@Mom我重写了我的脚本，并在我的答案中添加了一些有用的链接。现在页面会根据无限循环自动滚动。但是用户可以通过页面末尾的链接停止它。