Question

我有一段代码，当页面加载时，它会自动滚动到最后一个元素：

<!DOCTYPE html>
<html>
<head>
    <title>...</title>
    <script src="jquery-2.1.0.js"></script>
    <script src="jquery.scrollTo-1.4.3.1.js"></script>
</head>
<body>


    <h1 id="begin">Begin</h1>
    ...
    <h1 id="end">End</h1>

    <script>
        $(window).load(function () {
            $('body').scrollTo('#end', {duration:5000});
        })
    </script>

</body>
</html>

我想要做的是当它到达 end 元素时，它会向上滚动到 begin 元素，然后继续该过程直到满足特定标记。

所以这里有两个问题：

当到达 end 时如何使窗口向上滚动？
如何检查是否遇到特定元素ID并停止循环？

Answer 1

此功能可以使用

    $('.go-top').click(function (e) {
    e.preventDefault();
     $('html,body').animate({                   
        scrollTop:$("YourID").offset().top + 'px'
            }, 'slow');});

Answer 2

转到具有someID的特定元素：

$('html, body').animate({
    scrollTop: $("#someID").offset().top
}, 2000);

滚动到页面顶部：

$('html, body').animate({scrollTop: '0px'}, 300);

滚动后检查元素是否可见：

function isScrolledIntoView(elem)
{
var docViewTop = $(window).scrollTop();
var docViewBottom = docViewTop + $(window).height();

var elemTop = $(elem).offset().top;
var elemBottom = elemTop + $(elem).height();

return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
}

如果到达特定元素，则向上滚动网页

2 个答案: