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

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

12 голосов
/ 18 января 2012

У нас есть вертикальная прокрутка, которая работает нормально со следующим 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

Заранее спасибо!

1 Ответ

6 голосов
/ 01 октября 2012

Я обнаружил, что могу это исправить, найдя / исправив / удалив элементы, которые шире, чем ширина. Например, если у вас есть 100% ширина вашего контейнера, а затем элемент внутри имеет 100% ширину с полем или отступом, даже если переполнение скрыто в контейнере, страница будет перемещаться из стороны в сторону.

Если вы можете убедиться, что ваши элементы внутри не проливаются горизонтально за пределы контейнера, страница не будет перетаскиваться. Если вам нужно заполнить процентную ширину внутри контейнера (например, один элемент с шириной 100% или два с 50% или любым другим), 'box-sizing: border-box;' это путь вперед.

...