Вертикальный и горизонтальный скролл на iphone?

Question

[Алексей Каратеев]

Всем привет. Проблема заключается вот в чём: на мобильном устройстве на сайте нет скролла, т.к весь контент помещается, это мне и нужно. Проверяю с Андроида, все отлично, но на Айфоне заказчик мне присылает видео, где он свайпает вверх вниз, при этом бокового скролла не появляется. Опять же на моем устройстве такого и в помине нет. На другой странице наоборот, вертикально не свайпается, за то по горизонтали свайпается. За пределы контейнера ничего выходить не может, т.к в dev tools на всех разрешениях проверяю - горизонтального скролла нет. Кстати, попросил его зайти на сайт с Айфона через браузер Google Chrome, там ничего не свайпается, правда на другой странице горизонтальный скролл все равно остался (у меня его нет). Говорит проверяет с Iphone 11 pro.

Пробовал отключать touchmove вот так:

function myFunction(x) {
	if (x.matches) { // Если медиа запрос совпадает
		document.body.addEventListener('touchmove', function (e) {
			e.preventDefault();
		});
	}
}
let x = window.matchMedia("(max-width: 500px)")
myFunction(x) 
x.addListener(myFunction);

Это не помогло. Подскажите, пожалуйста, как это можно пофиксить.

Answer 1

[Марти Макфлай]

body, html {
    // Всё кроме сафари
    overscroll-behavior: none;
    // А это поможет в сафари, но только если контент не больше вьюпорта
    touch-action: none;
}

Comments

[Алексей Каратеев]

Спасибо, помогло!

[Марти Макфлай]

Алексей Каратеев, рад помочь! А чем кстати помешал оверскролл? Или просто заказчику не нравится?

[Алексей Каратеев]

Марти Макфлай, заказчик хочет, чтобы на телефонах не было скролла вообще, по его мнению без скролла смотрится как приложение, а не как сайт