"-webkit-overflow-scrolling:touch"导致移动设备出现垂直滚动问题

Question

我正在制作一个响应迅速的移动网站.在我的手机上进行测试时,我注意到我无法垂直滚动可以水平滚动的内容.

这是我的意思的一个例子(抱歉,你不能看到你的手机上的水平滚动,但只是相信我,它的工作原理).

在此示例中,移动Webkit浏览器无法滚动表格:http: //jsfiddle.net/tArEy/

然后我注释掉以下行以使垂直滚动工作.但是,这使得水平滚动有点不稳定.

-webkit-overflow-scrolling: touch;

在这个例子中,移动Webkit浏览器可以滚动到表格之外,但是它有点麻烦. http://jsfiddle.net/tArEy/1/

有没有人知道如何使用CSS解决这个问题？

演示必须在浏览器上进行测试.(我在Android上运行Chrome浏览器.我认为iPhone有同样的问题).

编辑:

事实证明,在没有CSS中的以下行的情况下,在移动webkit浏览器中水平滚动是非常错误的:

-webkit-overflow-scrolling: touch;

然而,这条线使得无法垂直滚动,所以我有点停滞不前.其他非webkit浏览器水平滚动就好了.

编辑2:

我把手放在了iphone上.溢出滚动是硬件加速并且完美无缺.这似乎只是针对Android的Chrome问题.

Answer 1

这是 Android 版 Chrome 中的一个错误。它在最近的升级中得到了修复。