使用JavaScript滚动到页面顶部？

如何使用JavaScript滚动到页面顶部？滚动条立即跳到页面顶部也是可取的，因为我不希望实现平滑滚动。

当前回答

非jQuery解决方案/纯JavaScript：

document.body.scrollTop = document.documentElement.scrollTop = 0;

其他回答

<script>
$(function(){
   var scroll_pos=(0);          
   $('html, body').animate({scrollTop:(scroll_pos)}, '2000');
});
</script>

编辑：

$('html, body').animate({scrollTop:(scroll_pos)}, 2000);

另一种上下边距滚动方式：

window.scrollTo({ top: 100, left: 100, behavior: 'smooth' });

<script>

  $("a[href='#top']").click(function() {
     $("html, body").animate({ scrollTop: 0 }, "slow");
     return false;
  });
</script>

html格式

<a href="#top">go top</a>

document.getElementById（“elem”）scrollIntoView（）；

如果您想平滑滚动，请尝试以下操作：

$("a").click(function() {
     $("html, body").animate({ scrollTop: 0 }, "slow");
     return false;
});

另一种解决方案是JavaScript window.scrollTo方法：

 window.scrollTo(x-value, y-value);

参数：

x值是沿水平轴的像素。y值是沿垂直轴的像素。

纯JavaScript解决方案：

function scrollToTop() {
  window.scrollTo({
    top: 0,
    behavior: 'smooth'
});

我在Codepen上编写了一个动画解决方案

此外，您可以尝试使用CSS滚动行为的另一种解决方案：smooth属性。

html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}

推荐文章