-webkit-overflow-scrolling 打破绝对定位 [英] -webkit-overflow-scrolling breaks absolute positioning
问题描述
我正在构建一个页面，该页面需要有一些元素会粘在页面顶部，否则它们会被滚出屏幕.我设法使用 position:absolute 做到了这一点.一切正常，但它需要动量滚动.我将 -webkit-overflow-scrolling: touch 添加到可滚动区域的 css 中.这打破了一切.我的带有 position:absolute 的粘性元素现在只是随其余内容一起滚动.
I am building a page that needs to have some elements which stick to the top of the page when they would otherwise be scrolled off the screen. I managed to do this using position:absolute. Everything was working perfectly, but it needed momentum scrolling. I added -webkit-overflow-scrolling: touch to the css of the scrollable area. This broke everything. My sticky elements with position:absolute are now just scrolling with the rest of the content.
我的问题是:
为什么 -webkit-overflow-scrolling: touch 会影响绝对定位，有没有办法解决?
Why does -webkit-overflow-scrolling: touch affect absolute positioning, and is there a way around this?
更新:每当子元素变为固定"或未固定"时，我都会添加警报.警报继续触发，因此样式仍在应用中，只是不起作用.这意味着跟踪滚动位置不是问题，而是样式问题.
UPDATE: I added an alert whenever a child element becomes "fixed" or "unfixed". The alerts continue to fire, so the styling is still being applied, it just isn't working. This means that it's not a problem with keeping track of scroll position but rather a problem with the styling.
更新:我尝试使用 position: fixed 而不是 position: absolute 并且 -webkit-overflow-scrolling 也打破了这一点
UPDATE: I tried using position: fixed instead of position: absolute and -webkit-overflow-scrolling broke that too
更新:经过大量挖掘，我发现了对这个问题的引用此处 和 此处.但是，在这两种情况下，唯一提出的解决方案是重构 DOM，使粘性元素不在可滚动区域中.就我而言，这是一件很难做到的事情，我宁愿不必这样做.自 ios5 以来事情有进展吗?还是唯一的选择?
UPDATE: After a lot of digging, I found references to this problem here and here. However, the only proposed solution in both cases is to restructure the DOM so that the sticky elements are not in the scrollable area. This is a difficult thing to do in my case, and I would prefer not to have to. Have things progressed since ios5 or is that still the only option?
推荐答案
关于最后一个问题 - 是的，该问题存在于 ios5 中.提取可滚动区域外的绝对定位元素对我来说效果很好.
On the last question - yes the issue is present in ios5. Extracting the absolute positioning element outside of the scrollable area worked fine for me.
这篇关于-webkit-overflow-scrolling 打破绝对定位的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
