如何复制固定在 iOS 上的后台附件 [英] How to replicate background-attachment fixed on iOS
问题描述
我正在尝试让固定背景图像 div 在 iOS 上为学校项目工作.我一直在用
I'm trying to get fixed-background-image divs working on iOS for a school project. I've been using
background-attachment: fixed;
但这会导致在移动 Safari 中出现奇怪的大小和没有滚动效果.这是我正在使用的网站；我目前用于引用 div 图像背景的方法在桌面上运行良好，但在 iOS 上完全失败.
But this is leading to weird sizing and no scrolling effects in mobile safari. Here is the site that I'm working with; the method I'm currently using for the quote div image backgrounds works well on desktops but fails completely on iOS.
不知何故，http://www.everyonedeservesgreatdesign.com 让这个工作起来.我在执行代码时遇到困难，因为他们使用的是某种方形空间模板，但看起来他们将图像放入 position:fixed div 中，该 div 以某种方式被其 position:fixedcode>position:relative 父 div.我的印象是不可能用除视口以外的任何东西来剪辑 position:fixed div，所以我很好奇这里发生了什么.
Somehow, http://www.everyonedeservesgreatdesign.com got this working. I'm having difficulty following the code because they're using a squarespace template of some kind, but it looks like they're putting images into a position:fixed div that is somehow being clipped by its position:relative parent div. I was under the impression that it wasn't possible to clip position:fixed divs with anything other than the viewport, so I'm very curious as to what's going on here.
关于如何为我网站中的固定图像 div 背景实施此方法的任何想法?
Any ideas on how to implement this method for fixed image div backgrounds in my site?
推荐答案
之前有人问过，显然移动浏览器的成本很高，所以被禁用了.
It has been asked in the past, apparently it costs a lot to mobile browsers, so it's been disabled.
查看 @PaulIrish 的评论:
固定背景具有巨大重绘成本并降低滚动性能，我相信这就是它被禁用的原因.
Fixed-backgrounds have huge repaint cost and decimate scrolling performance, which is, I believe, why it was disabled.
您可以在此帖子中看到解决方法:
you can see workarounds to this in this posts:
这篇关于如何复制固定在 iOS 上的后台附件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
