Прокрутка медленно на мобильных /ios при использовании переполнения: прокрутка

Чтобы настроить меню без холста, я должен настроить тело на "переполнение: скрытое", чтобы удалить прокрутку из тела и добавить его обратно в контейнер вокруг содержимого с помощью "переполнения-y: прокрутка". Когда я это делаю, это замедляет прокрутку на мобильных устройствах iOS.

Есть ли какая-то проблема с производительностью при перемещении полосы прокрутки из тела?

Ответы

Ответ 1

Вместо того, чтобы проблема с производительностью, вероятно, вы не увидите прокрутку "Momentum" на вашем устройстве iOS

Это можно решить, добавив '-webkit-overflow-scrolling: touch' в ваш элемент прокрутки i.e:

.scrolling-content {
   overflow-y: scroll;
   -webkit-overflow-scrolling: touch;
   height:100%; /*A value other than height:auto needs to be set*/
}

По умолчанию устройства iOS используют прокрутку "импульс" на теле, но добавление "overflow-y: scroll" к элементу не задает прокрутку элемента по умолчанию

Подробнее о https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-overflow-scrolling

Примечание: существует ряд Gotcha/Bugs с использованием -webkit-overflow-прокрутки: коснитесь определенных браузеров