【问题标题】:How can I prevent background-attachment:fixed; from lagging my website?如何防止背景附件:已修复;从滞后我的网站?
【发布时间】:2011-12-19 06:53:00
【问题描述】:

我正在使用背景附件:已修复;在我的网站上,但它导致 Chrome 对某些用户来说滞后。有没有办法在不造成延迟的情况下达到同样的效果?自从我删除它后,延迟已经停止,但我更喜欢我网站的外观。

【问题讨论】:

  • 阅读这篇文章有帮助吗? stackoverflow.com/questions/7033979/…
  • @Quincy,我确实看到了这个。无法从中找出任何替代方法。我发现的唯一方法是将附件更改为滚动(默认)。

标签: css


【解决方案1】:

实际上是known bug,从 2011 年开始,background-attachment:fixed 规则会导致浏览器在每次滚动时重新绘制背景,这在大屏幕和 Retina 显示器上是个问题。

有一个解决方法,将此规则添加到您的 css 样式表中:

html{
  -webkit-transform: translate3d(0,0,0);
}

【讨论】:

  • 这似乎停止了“background-attachment:fixed”规则的应用。
  • 一件事,确保您的图像尺寸不大。我尝试添加一个 500kb 的图像作为背景并固定附加。即使我添加了 translate3d,它也是滞后的。
猜你喜欢
  • 2019-10-04
  • 1970-01-01
  • 2021-10-24
  • 2015-06-09
  • 1970-01-01
  • 2012-10-13
  • 2021-12-23
  • 1970-01-01
  • 2017-05-17
相关资源
最近更新 更多