Question

现在，我正在使用

 window.scrollTo('#body')

滚动到页面顶部，但它非常瞬间，看起来很奇怪。所以，我想要一个功能，在按钮点击底部但不是瞬间点击后滚动到顶部。

Answer 1

为什么不使用jquery

$（'body'）。animate（{scrollTop：0}）;

Answer 2

几天前做了类似的事情并且花了很长时间才找到了一个简单而又微妙的解决方案：

代码是.net项目的一部分，但是因为你标记了javascript-events，我以为我也会粘贴它。它在更新面板之后运行。

<script type="text/javascript">
// <![CDATA[
    var prm = Sys.WebForms.PageRequestManager.getInstance();

    prm.add_endRequest(resetPosition);

    function resetPosition() {
        //prm._scrollPosition.y = 0;
        //window.scrollTo(0, 0);
        //$(window).scrollTop();
        $("html, body").animate({scrollTop: 0}, 100);
    }
// ]]>
</script>

所以对于按钮点击：

$(function(){
    $("#myButton").click(function(){
        $("html, body").animate({scrollTop: 0}, 200);
    });
});

Answer 3

使用jQuery的动画将是最直接的方式。但是，如果你想坚持使用纯JS，你可以这样做：

function scrollUp() {
  window.scrollBy(0, -10); // change this '10' as needed to control the smoothness of the scroll
  if(window.pageYOffset > 0) setTimeout(scrollUp, 10);
}

scrollUp();

如何向下滚动到顶部，但不是瞬间？

3 个答案: