Плавная прокрутка с ошибкой рендеринга с привязкой к прокрутке: как исправить? - PullRequest
0 голосов
/ 12 июля 2020

У меня есть страница, где основным элементом является контейнер с scroll-snap-type: x mandatory, чтобы иметь несколько слайдов, между которыми пользователь может пролистывать. Определенные события в моем приложении запускают автоматическую прокрутку до определенного c слайда. Я использую для этого анимированную библиотеку плавной прокрутки (которая находится в Elm).

Я обнаружил, что для того, чтобы анимация работала, мне пришлось удалить стили привязки прокрутки на время анимации (спасибо ответ на этот вопрос ). Это отлично работает на Chrome, Firefox и на рабочем столе Safari.

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

Поскольку в Safari (iOS и на рабочем столе) плавное анимация прокрутки работает без удаления стилей привязки прокрутки, наивным решением, казалось бы, было переключение стилей только для браузеров, не поддерживающих WebKit. Однако я бы хотел избежать попыток обнаружить механизм рендеринга, если это вообще возможно.

Итак, я спрашиваю, может ли кто-нибудь предложить альтернативные способы работы с этими двумя ошибками (ошибка переключения рендеринга с помощью скроллинга WebKit, без плавной прокрутки с щелчком на других движках). Могу ли я как-нибудь использовать префиксы поставщиков в моем CSS? Или какая-то стратегия обнаружения функций?

Изменить: Я воспроизвел проблему iOS с этой скрипкой и этим Ell ie (немного удобнее для мобильных устройств). После компиляции / запуска проведите пальцем до третьего слайда и несколько раз нажмите «Toggle scroll-snap». Lorem ipsum должна исчезнуть.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...