Как отключить горизонтальное перетаскивание? (webkit-overflow-scrolling: touch;)

Question

У нас есть вертикальная прокрутка, которая отлично работает со следующей CSS для прокрутки в веб-наборе iOS 5, но мы все еще можем перетаскивать страницу влево и вправо. Как мы можем отключить перетаскивание влево и вправо?

Вот 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-sizing: border-box;' это путь вперед.