平滑滚动 变得更加容易。 如果你希望在页面上始终使用它，并且你乐意让浏览器为你处理持续时间，那么只需一行 CSS 代码即可
html {
scroll-behavior: smooth;
}我在本网站的 第 17 版 上尝试了这个功能，它成为了 第二不受欢迎的功能，仅次于粗大的滚动条。 我没有改变滚动条。 我喜欢它。 我是滚动条的忠实用户，将其设计得粗大对我来说更实用，而且自定义样式也很有趣。 但我确实恢复了不使用平滑滚动。
正如 Šime Vidas 在 Web Platform News 中 指出的，维基百科也尝试过平滑滚动
最近为移动设备上的差异中移动的段落设计的动画滚动，在点击段落的另一个实例时会出现动画滚动。 此动画的目的是帮助用户了解段落移动到的位置。
我们最初认为此行为将使 Minerva 整体受益（例如，当使用目录导航到页面部分时，动画滚动将非常棒），但在尝试后，我们决定将此更改范围限制为目前仅用于移动设备上的差异视图
我理解无法调整时间是一个缺点，但这不是我放弃平滑滚动的原因。 让很多人感到沮丧的是 页面内搜索。 点击链接并被放大到某个标题（感觉还不错）是一回事，但当你试图快速浏览匹配项时，当你对页面执行 查找 操作时，又是另一回事。 人们发现匹配项之间的滚动速度很慢，而且很令人沮丧。 我同意。
令人惊讶的是，即使是平滑滚动的 JavaScript 变体…
document.querySelector('.hello').scrollIntoView({
behavior: 'smooth'
});…也无法调整时间。 也没有可靠的方法来检测页面是否正在积极地进行搜索，以便进行 UX 更改，例如关闭平滑滚动。
也许平滑滚动最大的缺点是可能会错误地管理焦点。 在 JavaScript 中滚动到元素是可以的，只要你几乎将焦点移动到滚动到的位置即可。 Heather Migliorisi 在此详细介绍。
Firefox（至少在 Linux 上）在使用页面内搜索时会自动“禁用”平滑滚动。
我刚刚在 macOS 上尝试了一下，似乎也是这样。 Firefox 做得好！ 我认为这是理想的 UX。
你注意到所有不能使用 scroll-behavior 的地方了吗？
https://caniuse.cn/#search=scroll-behavior
我见过两种对“平滑滚动”的定义。 一种是链接点击时的平滑自动滚动，我能理解为什么这可能会令人讨厌，但只要它只在页面下方的链接上出现，它就相对无害。
不幸的是，我看到很多网站使用 JavaScript 来覆盖用户的滚轮行为，这完全是另一回事，而且经常使用相同的名字。 它在演示中看起来可能很漂亮，但对于最终用户来说，它是一个可用性噩梦，使滚轮操作速度变慢，精度降低。
总的来说，我认为弄乱输入设备是个坏主意。 人们对如何与网站交互有一定的期望，这基于他们自己的经验和鼠标/浏览器配置，每当你告诉用户你知道他们应该如何使用他们的电脑，你就有可能赶走他们。
我认为后者通常被称为“滚动劫持”，对吗？
这很有趣，因为我从来没有想过查找/搜索也会进行动画。 我觉得这是浏览器的疏忽，因为使用这样的内置浏览器功能应该独立于网站的代码。
根据规范，平滑滚动的持续时间由用户代理管理，我认为这是有道理的。 据我所知，在大多数浏览器中，这是通过 about:config 中的某个标志来配置的... 因此，用户甚至可以将其设置为 0 以完全禁用它。 我认为这绝对是正确的方法，尽管浏览器应该在未来使此配置选项更加突出...
我更喜欢始终显示滚动条，但我不同意在用户已通过其操作系统设置明确选择隐藏滚动条时，强制使用一个很大、俗气、橙色/粉红色的滚动条。 我认为，如果用户有选择权，并且他们已经明确表明了他们的选择，我们应该尽力尊重他们的选择。
注意：Firefox 似乎无论 CSS 如何，都会尊重用户的选择，因此向他们致敬。
我可能对此一无所知，但为什么人们如此讨厌平滑滚动？ 在大多数情况下，像这样，它似乎是一个非常有用且有用的功能。
我可能遗漏了一些东西，是吗？ 关于为什么它如此不受欢迎？
看看我在上面文章中写的内容 - 它与“在页面上查找”被更改（在 Chrome 中）有关。
因此，文章的标题应该改为“将平滑滚动应用于整个页面时的弊端”？ 对于指向另一个部分的单个锚点链接，我也看不出有什么弊端。 不喜欢这种过渡或根本不喜欢动画的人可以全局禁用此浏览器行为（正如我在我的第一条评论中提到的）。
此功能的浏览器支持情况如何？ 你实施新功能的浏览器支持基准是什么？
就我个人而言... 我使用 chromium，并启用了覆盖滚动条。 我经常使用一个弹射器（便宜的 Wacom 一体式平板电脑，带 2 个按钮），并且大量使用平滑滚动。
如果我们有一个
:root:searching伪属性，也许还有一个:root::searchbar伪元素可以进行有限的样式（也许）会很有用。事件也是如此。 一组
search事件，例如，它需要一个 DOM 节点异步迭代器将很有用。 例如，searchopen、searchbegin、searchterminate、searchrestart等等。 你将从一个文本节点文档迭代器开始... 我猜。尽管如此，在无限滚动器上会更有用。
因此，解决你问题的答案似乎是，你只希望在用户点击锚点链接时暂时启用平滑滚动。
当用户点击链接时，启用平滑滚动。 浏览器应该平滑滚动。 用户点击链接后一秒钟，禁用平滑滚动。
最终效果是，在点击链接时，你获得了人们喜欢的平滑链接滚动。 在使用 ctrl + F 时，平滑滚动被禁用。
我喜欢粗大的滚动条，它很突出，易于使用。 我只是不喜欢它有浮雕效果，而这种效果在重新设计的其他地方都没有出现。
最糟糕的是，当它是 JavaScript 管理的（如你指出的滚动劫持）时，它在移动设备上总是卡顿，几乎无法使用。
但是，当通过 JavaScript 触发原生方法时，例如
它只发生在选定的链接上，因此我认为没有缺点。
顺便说一句：为什么有人会想要将 CSS 平滑滚动属性放在整个页面上？！
在我的网站上，我使用的是 JS 变体的平滑滚动，但仅用于特定链接。 因此，它只在点击导航中的链接和主容器中的链接时才会被触发，如果这些链接指向页面内部锚点。 这自然不包括网站内搜索等。 但是... 给人们一个工具，他们就会滥用它... 翻白眼
cu，w0lf。