css - 背景附件 :fixed; on mobile Safari

我正在尝试在此模板中使用漂亮的视差效果。它似乎适用于除移动版 Safari 之外的所有浏览器(不寻常)!

查看 iPad 上的 ABOUT 和 FOURTH 部分，背景图像丢失了(大概是因为它粘在页面顶部其他元素的后面。

有人知道解决这个问题的方法吗？

非常感谢。

最佳答案

移动 iOS 上的视差并不那么容易:safari 会在滚动时阻止所有渲染(以提高性能)，因此您无法测量当前滚动的距离并将其应用于背景位置。图片只会在您完成滚动后刷新它的位置(并且没有动画，所以您看不到它的任何内容)。

有变通办法，但实现起来并不容易。其中之一是 http://markdalgleish.com/projects/stellar.js/与其 iOS techdemo .

最佳解决方案:拆分您的 css 标记并让视差仅对桌面设备可见。由于视差需要很大的功率(因为它不是硬件加速的)，所以它不太适合移动设备。

关于css - 背景附件 :fixed; on mobile Safari，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14502345/