如何在引导程序中在我的网页上实现平滑滚动？ [复制]

Question

我的网页很长，所以我想介绍一下目录。现在我想——而不是仅仅跳到网页中的新位置——平滑地滚动到那里。我看到了很多关于如何从导航栏导航到特定位置的教程，但我想通过网页上的普通超链接来完成。

到目前为止，在我的 html 中我有：

<h4>contents</h4>
 <ul>
   <li><a href="#part1">part1</a></li>
   <li><a href="#part2">part2</a></li>
   <li><a href="#part3">part3</a></li>
   <li><a href="#part4">part4</a></li>
   <li><a href="#part5">part5</a></li>
 </ul>

<div class="row" id="part1">
    <h4>lorem ipsum</h4>
    <p>lorem ipsum lorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsum</p>
</div>
<div class="row" id="part2">
    <h4>lorem ipsum</h4>
    <p>lorem ipsum lorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsum</p>
</div>
<div class="row" id="part3">
    <h4>lorem ipsum</h4>
    <p>lorem ipsum lorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsum</p>
</div>
<div class="row" id="part4">
    <h4>lorem ipsum</h4>
    <p>lorem ipsum lorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsumlorem ipsum</p>
</div>

有没有实现平滑滚动的原生引导方式？或者是否有任何我可以以某种方式为自己调整的 js 脚本？

Answer 1

在 jQuery 中有一个名为 animate 的函数。

$('html, body').animate({
    scrollTop: $("#myId").offset().top
}, 2000);

您可以根据自己的喜好更改持续时间。

Answer 2

还有一个问题可能会帮助您获得您想要的东西，但 window.scrollTo() 似乎正是您要找的东西！ Here's the question