iPhone Web App - 在iOS8中停止身体反弹/滚动 [英] iPhone Web App - Stop body bounce/scrolling in iOS8

问题描述

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

Yes, I know. This question has been asked a thousand times before. Thanks to all you guys, I was able to find a solution that finally did the job for me in <= iOS7. However, after updating to iOS 8 - nothing seems to work!

在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() });
});

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

Other solutions I've tried:

全部在这里： iPhone Web App - 停止正文滚动

这里： iOS Safari - 如何禁用过度滚动但允许可滚动的div正常滚动？

这里：禁用iOS Overscroll但允许正文滚动

还有更多...

所以，有没有人知道 iOS8兼容的禁用身体越界滚动 /反弹效果的方式（除了应用于phonegap项目的原生解决方案）？

So, does anyone know an iOS8 compatible way of disabling the body out of bounds scroll / bounce effect (besides from native solutions applied to phonegap projects)?

推荐答案

所以这也困扰了我很多年，我终于开始了和解决方案！

So this has been bothering me for ages too and I finally found a solution!

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

Pre iOS8, Safari has no subpixel rendering. Now that there is subpixel rendering, the reported element height is given as the subpixel decimal, and the scroll height is the actual rendered integer heigh. If you specify sizes in percent, this can result in the height being a fraction of a pixel smaller than it should be.

而不是测试

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

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

Testing for this will give you the rounded number that matches up.

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

这篇关于iPhone Web App - 在iOS8中停止身体反弹/滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！