iOS 9 `-webkit-overflow-scrolling: touch` и` overflow: scroll` перерывы прокрутки

Я разрабатываю webapp, и у меня есть div внутри iFrame, у которого есть скрытый, переполненный контент, который я хочу прокручивать.

На Safar на iOS 9, когда я добавляю -webkit-overflow-scrolling:touch; к div (у которого уже есть overflow-y: scroll; чтобы дать свитке ощущение жидкости, оно ломается и не прокручивается вообще.

Я знаю, что это известная проблема, но я не нашел решений, имеющих отношение к моему сценарию: у меня есть iFrames, которые делают больше, чем передачу данных, они фактически содержат контент для пользователя. Ориентация не имеет значения, содержимое всегда нужно прокручивать.

Я просто столкнулся с этой проблемой с динамическим контентом в div, который имел overflow: auto и -webkit-overflow-scrolling: touch .

Грязное, уродливое обходное решение: заставить содержимое внутри быть больше, чем прокручиваемый div при добавлении в dom. Что-то вроде этого:

 <div style="overflow: auto; -webkit-overflow-scrolling: touch;"> <div style="min-height: 101%"> dynamic content </div> </div> 

Моя теория заключается в том, что Safari пытается (требует) сделать некоторые тяжелые оптимизации при -webkit-overflow-scrolling: touch добавлен, и они не играют хорошо с некоторыми типами динамического контента.

Я также столкнулся с этой проблемой с webkit-overflow-scrolling: touch iOS9. Его можно воспроизвести на устройстве или симуляторе iOS. Как упоминает Кристофер Кэмпс, это происходит только с динамическим контентом, то есть с содержимым, которое изменяется от меньшего размера, чем прокручиваемый контейнер до большего, чем контейнер.

Heres CodePen демонстрирует эту проблему , включая исправление Кристофера Кэмпса .

Кажется, еще один взлом для этой ошибки Safari – использовать javascript для установки style="overflow: none" и сразу же вернуть его обратно к своему предыдущему значению.

  • Как очистить историю в WKWebView?
  • Почему здесь не работает прокрутка импульса? (с использованием -webkit-overflow-scrolling: touch)
  • Каковы последствия использования неподдерживаемого свойства WebKit?
  • CSS3 - Анимация свойства margin-left через JavaScript
  • Сбой: WebThread - EXC_BAD_ACCESS KERN_INVALID_ADDRESS
  • Как изменить цвет элемента HTML, когда пользователь нажимает на него?
  • Прокрутка iOS Safari вверх не работает на определенных страницах. Зачем?
  • iOS / WebKit: touchmove / touchstart не работает на входе & textarea
  • Как изменить цвет выделения текста в WKWebView?
  • WebKit бросает исключение на iOS 8 для вызова setBeingRemoved:
  • Получение всех файлов cookie из WKWebView
  • Давайте будем гением компьютера.