Question

这个问题可能看起来像是一个重复的问题，但我没有找到真正的答案如何像Ctrl + Home常用的浏览器快捷方式一样快速跳转到页面顶部。

许多建议如何做到这一点＆＃34;顺利＆＃34; - 但我需要一个最快的JUMP顶部，没有任何＆＃34;平滑滚动＆＃34;。

我有以下常用功能

<script type="text/javascript">
var timeOut;
function scrollToTop() {
  if (document.body.scrollTop!=0 || document.documentElement.scrollTop!=0){
    window.scrollBy(0,-100);
    timeOut=setTimeout('scrollToTop()',0);
  }
  else clearTimeout(timeOut);
}
</script>

那么，如何强迫它真正跳到最顶层......不是＆＃34;平滑滚动＆＃34; ？

任何其他解决方案（除上述功能旁边）也很有用。

感谢任何提示尝试。

Answer 1

只需尝试window.scroll(0,0)。

滚动功能本身并不包含任何延迟或平滑过渡。因此，如果您只是将x，y坐标传递为0,0，您将立即移至窗口顶部。

Answer 2

尝试使用：window.scrollTo(0, 0);

Answer 3

您只需使用锚点即可。

<script type="text/javascript">
function scrollToTop() {
    window.location = '#';
}
</script>

Answer 4

＆＃13;

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

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque rhoncus ligula ut lacus vestibulum, sit amet auctor risus ultrices. Morbi fringilla non ex vel placerat. Donec ut libero condimentum, vestibulum libero sit amet, maximus nulla. Vivamus sit amet turpis scelerisque, varius lectus vel, tincidunt metus. Nulla at porta diam. Pellentesque vel interdum arcu, quis porttitor lacus. Pellentesque sollicitudin ante sapien, a fermentum ligula aliquam sed. Vivamus vitae consequat justo, ac fringilla nunc. Fusce quis commodo est. Pellentesque a augue non odio porttitor vulputate. Etiam maximus orci sed libero rutrum, in rutrum dui tristique. Praesent semper laoreet convallis. Nam volutpat lectus dolor, ut tincidunt enim bibendum et. Sed nisl arcu, tempus vel dui at, egestas dignissim orci.

Quisque vitae pellentesque nunc. Proin finibus quam massa, in lobortis neque consequat nec. Ut condimentum cursus molestie. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce eu enim eget odio vestibulum tincidunt ac sit amet nulla. Nullam pellentesque nisl fringilla imperdiet lobortis. Nullam malesuada, elit dictum placerat tristique, ex mauris pretium purus, eu venenatis est augue vitae enim.

Proin varius bibendum mi sed efficitur. Duis eget urna sodales risus mattis tincidunt non at massa. Vivamus ornare orci nisl, eu rutrum diam condimentum et. Cras suscipit velit odio, ac dictum eros dictum et. Aliquam ut finibus nulla, a eleifend dolor. Aenean vitae malesuada nisl. Sed tellus ante, auctor eget faucibus id, pharetra et nibh. Quisque lorem libero, sagittis quis arcu in, pellentesque consectetur enim. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam eget orci in risus rhoncus egestas consectetur in eros.

Etiam id auctor sem, eget finibus odio. Sed pellentesque mollis dolor, in fermentum diam aliquam quis. Phasellus finibus neque vel justo scelerisque, in luctus turpis fringilla. Nullam vitae orci sit amet augue vehicula cursus. Morbi fermentum orci ac ex fringilla, sed fringilla mi pharetra. Donec risus dolor, pretium id nunc et, tincidunt molestie eros. Duis tincidunt pharetra tincidunt. Pellentesque dignissim ipsum eu feugiat gravida. Etiam id pulvinar ligula, sit amet pretium mi. Fusce quis ultrices nunc, dapibus accumsan sapien. Proin et arcu ultrices, dignissim eros non, pretium leo. Vestibulum euismod turpis urna, nec consectetur dui congue eget. Interdum et malesuada fames ac ante ipsum primis in faucibus. Suspendisse ac nisl facilisis, vehicula sapien at, semper turpis. Pellentesque facilisis, leo vitae posuere lacinia, ex urna ullamcorper risus, eu sollicitudin risus neque quis libero.

Phasellus vulputate enim arcu, quis cursus diam dictum et. Aenean ac massa ut justo blandit facilisis. Maecenas sollicitudin fermentum mi non hendrerit. Etiam non feugiat odio. Nulla vel urna non magna consectetur facilisis. Sed vitae blandit erat. Ut ac consectetur lorem. Quisque luctus risus ex, vitae scelerisque risus suscipit a. Cras varius ex vitae lacinia blandit. Fusce a commodo mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque rhoncus ligula ut lacus vestibulum, sit amet auctor risus ultrices. Morbi fringilla non ex vel placerat. Donec ut libero condimentum, vestibulum libero sit amet, maximus nulla. Vivamus sit amet turpis scelerisque, varius lectus vel, tincidunt metus. Nulla at porta diam. Pellentesque vel interdum arcu, quis porttitor lacus. Pellentesque sollicitudin ante sapien, a fermentum ligula aliquam sed. Vivamus vitae consequat justo, ac fringilla nunc. Fusce quis commodo est. Pellentesque a augue non odio porttitor vulputate. Etiam maximus orci sed libero rutrum, in rutrum dui tristique. Praesent semper laoreet convallis. Nam volutpat lectus dolor, ut tincidunt enim bibendum et. Sed nisl arcu, tempus vel dui at, egestas dignissim orci.

Quisque vitae pellentesque nunc. Proin finibus quam massa, in lobortis neque consequat nec. Ut condimentum cursus molestie. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce eu enim eget odio vestibulum tincidunt ac sit amet nulla. Nullam pellentesque nisl fringilla imperdiet lobortis. Nullam malesuada, elit dictum placerat tristique, ex mauris pretium purus, eu venenatis est augue vitae enim.

Proin varius bibendum mi sed efficitur. Duis eget urna sodales risus mattis tincidunt non at massa. Vivamus ornare orci nisl, eu rutrum diam condimentum et. Cras suscipit velit odio, ac dictum eros dictum et. Aliquam ut finibus nulla, a eleifend dolor. Aenean vitae malesuada nisl. Sed tellus ante, auctor eget faucibus id, pharetra et nibh. Quisque lorem libero, sagittis quis arcu in, pellentesque consectetur enim. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam eget orci in risus rhoncus egestas consectetur in eros.

Etiam id auctor sem, eget finibus odio. Sed pellentesque mollis dolor, in fermentum diam aliquam quis. Phasellus finibus neque vel justo scelerisque, in luctus turpis fringilla. Nullam vitae orci sit amet augue vehicula cursus. Morbi fermentum orci ac ex fringilla, sed fringilla mi pharetra. Donec risus dolor, pretium id nunc et, tincidunt molestie eros. Duis tincidunt pharetra tincidunt. Pellentesque dignissim ipsum eu feugiat gravida. Etiam id pulvinar ligula, sit amet pretium mi. Fusce quis ultrices nunc, dapibus accumsan sapien. Proin et arcu ultrices, dignissim eros non, pretium leo. Vestibulum euismod turpis urna, nec consectetur dui congue eget. Interdum et malesuada fames ac ante ipsum primis in faucibus. Suspendisse ac nisl facilisis, vehicula sapien at, semper turpis. Pellentesque facilisis, leo vitae posuere lacinia, ex urna ullamcorper risus, eu sollicitudin risus neque quis libero.

Phasellus vulputate enim arcu, quis cursus diam dictum et. Aenean ac massa ut justo blandit facilisis. Maecenas sollicitudin fermentum mi non hendrerit. Etiam non feugiat odio. Nulla vel urna non magna consectetur facilisis. Sed vitae blandit erat. Ut ac consectetur lorem. Quisque luctus risus ex, vitae scelerisque risus suscipit a. Cras varius ex vitae lacinia blandit. Fusce a commodo mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
</div>
<button id="goToTop">Go to top</button>

＆＃13;

有关更多信息，请参阅Warface anwser

我使用持续时间等于0的.animate。

如何像Ctrl + Home一样快速跳转到页面顶部

4 个答案: