jQuery

Question

我正在尝试制作一个简单的脚本来检查用户是否按下了网页上的按钮。如果他这样做，它会检查用户是否已经滚动到某个 div，如果他这样做了，页面就会滚动到另一个，否则什么也不会发生。

从技术上讲，我的代码可以正常工作，因为它将 DOM 滚动到锚点，但作为副作用，它会阻止您在滚动之后滚动。

$("#scrollDownBttn").click(function(){

    var mainOffset = $("#pinkRegion").offset().top;

    $(document).on('scroll', function() {
        if ( $(document).scrollTop() > mainOffset ) {
                $(document).scrollTop( $("#brownRegion").offset().top );

        }
        else{

        }

    });
});

我正在努力适应 jQuery，但显然我还有很长的路要走。我什至不知道为什么它会冻结整个页面。知道为什么会这样吗？

Answer 1

试试这个：

$("#scrollDownBttn").click(function(){            
    $('html, body').animate({
            scrollTop: $("#pinkRegion").offset().top
        }, 500);
});

Answer 2

$("#scrollDownBttn").click(function(){

    var mainOffset = $("#pinkRegion").offset().top;


        if ( $(document).scrollTop() > mainOffset ) {
                $(document).scrollTop( $("#brownRegion").offset().top );

        }
        else{

        }


});

无需使用滚动事件

jQuery - 单击按钮滚动到锚点

jQuery - scroll to anchor on button click

html

javascript

css

anchor-scroll