JavaScript DOM изменения в touchmove отложены до конца прокрутки на мобильном Safari
в мобильном сафари, в процессе обработки touchmove для элемента я меняю className этого элемента. К сожалению, визуальное изменение не происходит во время прокрутки пользователя или до самого конца инерционной прокрутки.
что я могу сделать, чтобы получить className чтобы визуально сразу?
Подробнее: по-видимому, это не ограничивается изменениями className, но, по-видимому, любые изменения в DOM, такие как innerHTML и style.
3 ответов
Это по дизайну, к сожалению. iOS safari будет стоять в очереди все манипуляции DOM до конца прокрутки или жеста. Эффективно DOM замораживается во время прокрутки.
Я думал, что смогу найти ссылку на это на странице разработчика apple, но я могу найти только эту ссылку на jQueryMobile:http://jquerymobile.com/test/docs/api/events.html.
обратите внимание, что устройства iOS замораживают манипуляции DOM во время прокрутки, очереди их применять, когда прокрутка завершена. В настоящее время мы расследуем способы применения манипуляций DOM до начала прокрутки
надеюсь, что это помогает!
Я фактически построил этот сайт, и да, способ обойти это ограничение-не прокручивать сайт, используя встроенные функции браузера, но подделать его. JS слушает события колесика прокрутки и клавиатуры и настраивает свойство css top основного контейнера на свой собственный "scrollTop". Полоса прокрутки справа, конечно, является пользовательской JS. В этом случае он синхронизируется с тем же внутренним значением "scrollTop".
весь сайт - это всего лишь один большой Твин, с основным временная шкала, являющаяся его положением прокрутки, и все суб-анимации запускаются в определенное время. JS не уменьшен, поэтому взгляните в ScrollAnimator.файл js, все там.
просто измените положение на -webkit-sticky. Не устанавливайте верхнюю часть, чтобы она выглядела как обычный элемент, но выполнялась как фиксированный элемент. И вы можете обновить свой стиль, кроме позиции немедленно.