如何使用JavaScript滚动到页面顶部？滚动条立即跳到页面顶部也是可取的，因为我不希望实现平滑滚动。
当前回答
平滑动画的更好解决方案：
// this changes the scrolling behavior to "smooth"
window.scrollTo({ top: 0, behavior: 'smooth' });
参考：https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollTo#Example
其他回答
这样做不需要jQuery。一个标准的HTML标记就足够了。。。
<div id="jump_to_me">
blah blah blah
</div>
<a target="#jump_to_me">Click Here To Destroy The World!</a>
<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' });
使用AplineJS和TailwindCSS返回页首：
<button
x-cloak
x-data="{scroll : false}"
@scroll.window="document.documentElement.scrollTop > 20 ? scroll = true : scroll = false"
x-show="scroll" @click="window.scrollTo({top: 0, behavior: 'smooth'})"
type="button"
data-mdb-ripple="true"
data-mdb-ripple-color="light"
class="fixed inline-block p-3 text-xs font-medium leading-tight text-white uppercase transition duration-150 ease-in-out bg-blue-600 rounded-full shadow-md hover:bg-blue-700 hover:shadow-lg focus:bg-blue-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg bottom-5 right-5"
id="btn-back-to-top"
x-transition.opacity
>
<svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M3.293 9.707a1 1 0 010-1.414l6-6a1 1 0 011.414 0l6 6a1 1 0 01-1.414 1.414L11 5.414V17a1 1 0 11-2 0V5.414L4.707 9.707a1 1 0 01-1.414 0z" clip-rule="evenodd" />
</svg>
</button>
<script>
$("a[href='#top']").click(function() {
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
});
</script>
html格式
<a href="#top">go top</a>
你可以尝试在这个Fiddle中使用JShttp://jsfiddle.net/5bNmH/1/
在页脚中添加“转到顶部”按钮：
<footer>
<hr />
<p>Just some basic footer text.</p>
<!-- Go to top Button -->
<a href="#" class="go-top">Go Top</a>
</footer>
