为什么固定元素会减慢 Firefox 中的滚动速度？答案

【问题标题】：Why do fixed elements slow down scrolling in Firefox?为什么固定元素会减慢 Firefox 中的滚动速度？
【发布时间】：2010-09-09 05:11:47
【问题描述】：

为什么应用了 CSS position: fixed 的元素会导致 Firefox 在滚动它们所在的页面时占用 100% 的 CPU？有什么解决方法吗？

我在一些网站上注意到了这种行为，例如 StackOverflow 页面顶部的通知栏。我正在使用 Linux 以防万一。

【问题讨论】：

【解决方案1】：

这是bug #201307。

【讨论】：

【解决方案2】：

这是bugzilla中报告的错误

显然，一个解决方法（成功的报告参差不齐..）是disable smooth-scrolling

只需在“编辑”>“首选项”>“高级”中禁用平滑滚动即可。

【讨论】：

【解决方案3】：

如前所述，这是错误#201307。解决方法是禁用平滑滚动：

编辑 -> 首选项 -> 高级 -> 常规选项卡 -> 取消选中“使用平滑滚动”

【讨论】：

【解决方案4】：

这个网站有一个固定的元素“第一次在 Stack Overflow？查看常见问题解答！”，它在 Firefox 中非常慢。不过在 Opera 和 Chrome 上效果更好。 FF3、Windows XP、ATI。

【讨论】：

【解决方案5】：

它会占用 CPU，因为浏览器必须在每次滚动更改时重新绘制整个视口，而不仅仅是新的可见区域

【讨论】：

【解决方案6】：

您确定这里有直接链接吗？您是否创建了带有固定元素的静态 HTML 页面来验证您的理论？考虑到这些 CSS 属性的使用范围有多广，我想现在其他人会注意到它，无论您运行的是什么浏览器/操作系统。

【讨论】：