Переполнение-х iPod touch

Question

Я создаю мобильную версию сайта. У меня есть 3 деления, каждое 33,33% ширины тела с шириной 300% (так что они все на всю ширину экрана), смещено влево, так что они все рядом, и вы можете скользить между div, нажав ссылки.

Я добавил overflow-x: hidden; в тег body, чтобы удалить горизонтальную полосу прокрутки. Это отлично работает на рабочем столе, но на моем iPod touch я все еще могу перетаскивать и прокручивать пальцем по горизонтали, чего я не хочу.

Answer 1

Вам нужно иметь ширину 300% для элемента оболочки внутри body.Если у вас есть и width:300%, и overflow-x:hidden на теле, вы будете скрывать контент внутри body, только если контент, который вы хотите скрыть, имеет ширину более 300%.

См. мой пример с использованием оболочки внутри body.

Answer 2

Попробуйте добавить это в раздел HTML head:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />

Это установит ширину вашей страницы равной ширине просматривающего ее устройства.На устройстве iOS также будет отключен жест «щепотка к зуму».