如何禁用水平拖动？(webkit-overflow-scrolling:触摸；)

Question

我们有垂直滚动工作与以下iOS 5的webkit滚动“触摸”的css很好，但我们仍然能够左右拖动页面。如何禁用左右拖动？

下面是CSS：

#page_content{

-webkit-overflow-scrolling: touch;
overflow-x:hidden;
overflow-y: scroll;   
position:absolute;
height: 460px;
width: 320px;

}

视频如下：

http://dl.dropbox.com/u/1737103/scrolling.mov

提前感谢！

Answer 1

我发现我可以通过查找/修复/删除比宽度更宽的元素来修复它。例如，如果你的容器有100%的宽度，然后里面的一个元素有100%的宽度，带边距或填充，即使溢出隐藏在容器上，页面也会从一边拖到另一边。

如果你能确保你里面的元素不会水平地溢出到容器外面，页面就不会被拖拽。如果你需要在容器中填充一个百分比的宽度(比如一个元素的宽度是100%，或者两个元素的宽度是50%或者其他什么)，‘box-like: border-box;’是前进的方向。