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


当前回答

非jQuery解决方案/纯JavaScript:

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

其他回答

document.getElementById(“elem”)scrollIntoView();

function scrolltop() {

    var offset = 220;
    var duration = 500;

    jQuery(window).scroll(function() {
        if (jQuery(this).scrollTop() > offset) {
            jQuery('#back-to-top').fadeIn(duration);
        } else {
            jQuery('#back-to-top').fadeOut(duration);
        }
    });

    jQuery('#back-to-top').click(function(event) {
        event.preventDefault();
        jQuery('html, body').animate({scrollTop: 0}, duration);
        return false;
    });
}

这样做不需要jQuery。一个标准的HTML标记就足够了。。。

<div id="jump_to_me">
    blah blah blah
</div>

<a target="#jump_to_me">Click Here To Destroy The World!</a>

如果您不希望平滑滚动,您可以在启动平滑滚动动画时立即欺骗并停止它……如下所示:

   $(document).ready(function() {
      $("a[href='#top']").click(function() {
          $("html, body").animate({ scrollTop: 0 }, "1");              
          $('html, body').stop(true, true);

          //Anything else you want to do in the same action goes here

          return false;                              
      });
  });

我不知道它是否被推荐/允许,但它有效:)

你什么时候用这个?我不确定,但也许当您想使用Jquery一键制作一件事情的动画,而不使用动画制作另一件事情时?即打开页面顶部的管理登录面板中的幻灯片,然后立即跳到顶部查看。

$(“.solltop”).click(函数){$(“html,body”).animate({scrollTop:0},“slow”);return false;});.节{高度:400px;}.第1节{背景色:#333;}.第2节{背景色:红色;}.第3节{背景色:黄色;}.第4节{背景色:绿色;}.滚动条{位置:固定;右:10px;底部:10px;颜色:#fff;}<html><head><title>滚动顶部演示</title><script src=“https://code.jquery.com/jquery-3.3.1.js“></script></head><body><div class=“content wrapper”><div class=“section section1”></div><div class=“section section2”></div><div class=“section section3”></div><div class=“section section4”></div>滚动顶部</a></div></body></html>