发行使用iOS 5中滚动-webkit-溢出滚动(Issue with scrolling in i

2019-09-17 10:21发布

我有一个固定高度的div这应该是滚动(仅垂直)的HTML页面。 在IOS 5这可以使用以下方式实现:

overflow-y: auto;
-webkit-overflow-scrolling: touch;

div包含约10个项目的无序列表。

滚动的作品,但如果我刷我的手指斜向甚至在水平和垂直方向不是因为它应该是有时它只是滚动。

如果任何人遇到了这个问题,我想知道。 我不想认为这是在iOS5中的错误,但我不能找出我在做什么错的,因为大多数时间它工作正常。

Answer 1:

我有完全一样的问题。 原来,这个问题要由两个零大小的IFrame我的网站用来跟踪历史的变化和负载脚本造成的。 除去这些固定的问题。 我申请一个bug与苹果,等待听到他们回来。

检查看看,如果你有你的页面上,他们可能是原因的任何I帧。



Answer 2:

我已经找到了解决方案哈克,但它需要的JavaScript ...

我偶然发现了这个问题,同时通过AJAX加载滚动的节点,并与JS附加它们。

我发现,与JS重置-webkit-溢出滚动财产化险为夷

JS代码:

var myDiv = $('.myDiv');
myDiv.css('-webkit-overflow-scrolling','auto');
function fn(){
    myDiv.css('-webkit-overflow-scrolling','touch');
}
setTimeout(fn,500);

它真的很烂,我们必须调用setTimeout方法,但是这是我能想到的唯一途径...

编辑:当心display:none

Webkit的溢出滚动触摸CSS错误的iPad



Answer 3:

你需要把这个CSS设置在你的CSS文件-你加载一个使用content_css配置变量:

body {
    -webkit-transform: translate3d(0, 0, 0);
}

另一种选择是直接从TinyMCE的初始化代码设置的CSS:

$(tinymce.activeEditor.getBody()).css('-webkit-transform', translate3d(0, 0, 0));


Answer 4:

我在的iOS 5.1.1有同样的问题,并由于竟然是::after与伪元素position: fixed ,这是包含在滚动列表显示“错误的滚动轴”行为的一个元素。 详情点击此处 。



文章来源: Issue with scrolling in iOS 5 using -webkit-overflow-scrolling