Question

是的，我知道。这个问题之前已被问过一千次。感谢所有人，我能够找到一个解决方案，最终在＆lt; = iOS7中完成了我的工作。但是，在更新到iOS 8后 - 似乎没有任何效果！

在iOS7中对我来说非常有用

的CSS

html, body, .scrollable {
overflow: auto; 
-webkit-overflow-scrolling: touch;
}

的jQuery

$(function() {
  $(document).on("touchmove", function(evt) { evt.preventDefault() });
  $(document).on("touchmove", ".scrollable", function(evt) { evt.stopPropagation() });
});

我尝试过的其他解决方案：

所有这里：iPhone Web App - Stop body scrolling

在这里：iOS Safari – How to disable overscroll but allow scrollable divs to scroll normally?

在这里：Disable iOS Overscroll but allow body scrolling

还有更多......

那么，有没有人知道 iOS8兼容禁用身体越界滚动 /跳出效果的方式（除了应用于phonegap项目的本机解决方案）？

Answer 1

所以这一直困扰着我多年，我终于找到了解决方案！

在iOS8之前，Safari没有子像素渲染。现在有子像素渲染，报告的元素高度以子像素十进制的形式给出，滚动高度是实际渲染的整数高度。如果以百分比指定大小，则可能导致高度比像素小一小部分。

而不是测试

if (elem[0].scrollHeight > height) {
                    e.stopPropagation();
}

对此进行测试将为您提供匹配的舍入数字。

if (elem[0].scrollHeight > Math.ceil(height)) {
                    e.stopPropagation();
}

Answer 2

这与position: fixed更可靠地得到尊重的事实相结合，可以产生一些有趣的效果。你可以通过一个简单的固定“衬垫”进行刷新，这个“底衬”在身体被拉下时保持不动，从而显露出来。

回答你的问题：

如果满足以下条件，则抛出（touchmove）事件的event.preventDefault()处理程序应该有效：

事件比上一次更进一步
当前target元素和body位于scrollTop == 0
同样适用于上述两个条件来处理底部橡胶拉力（scrollTop + innerHeigh == scrollHeight）

如果您正在寻找更详细的解决方案，请告诉我，很高兴写下来。

Answer 3

这是preventOverScroll.js解决的问题

看看www.digitpro.it/Takashi的“Promozioni”和“Altro＆gt; Chi Siamo标签提供了一个带滚动的iframe而没有滚动弹跳效果:)随意查看源代码JS + CSS < / p>

iPhone Web App - 在iOS8中停止身体反弹/滚动

3 个答案: