webkit-overflow-scrolling заставляет элемент исчезнуть

У меня есть приложение/сайт, где я использую -webkit-overflow-scrolling: touch; для плавной прокрутки на iOS.

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

Если я закомментирую -webkit-overflow-scrolling: touch;, то он отлично работает, но прокрутка импульса исчезла. Я попытался добавить z-index хак на панель навигации, чтобы убедиться, что он загружается поверх всего, я также добавил несколько разных display свойств, чтобы посмотреть, смогу ли я взломать -webkit-overflow-scrolling: touch;, я даже пытался добавить элементы в память использует -webkit-transform: translate3d(0,0,0);, и ничего не работает. Панель навигации по-прежнему исчезает/глючит независимо от того, когда включена -webkit-overflow-scrolling: touch;.

Кто-нибудь уже сталкивался с этим глюком и разобрался? Я действительно не хочу загружать всю библиотеку JS только для обработки моей прокрутки, но мне, возможно, придется, если я не смогу понять этот сбой. Прокрутка без импульса кажется такой неуклюжей и непригодной для использования.


person Dylan Lott    schedule 23.02.2016    source источник


Ответы (2)


У меня такая же проблема. У меня был список элементов с -webkit-transform: translate3d(0,0,0);, которые не отображались, как только я включил -webkit-overflow-scrolling: touch;. Моя проблема заключалась в том, что у меня были элементы с -webkit-transform: translate3d(0,0,0);, вложенными в другой div.

Другими словами, между блоком с переполнением и прокруткой: touch и потомками с translate3d был div. Не понимал, что они должны быть прямыми детьми.

Как только я объединил свои div напрямую, он перестал скрывать элементы и работал отлично. Надеюсь, поможет.

person Jorge Suárez    schedule 13.04.2016

У меня такая же проблема. В моем случае я пытался использовать ::before для отображения наложения. Я работал в Chrome, но не в Safari/iPhone. В конце концов я не использую его, я заменяю его на ::after

person Levinski Polish    schedule 03.10.2018