Проблема с исчезновением выпадающего меню в iOS?

#javascript #ios #css #drop-down-menu

#javascript #iOS #css #выпадающее меню

Вопрос:

Следующий gif демонстрирует мою проблему:

введите описание изображения здесь

Вы открываете выпадающее меню, пытаетесь прокрутить, выпадающее меню исчезает (не закрывается, а просто … исчезает). Если вы подождете несколько секунд, он вернется и теперь работает отлично.

Я смог увидеть эту проблему только на устройствах iOS. Запись gif была сделана на симуляторе iPhone XS в safari на iOS 12.

Кто-нибудь сталкивался с такой проблемой и, возможно, знает решение? Я пытался увеличить z-индекс, я пытался добавить -webkit-transform: translate3d(0, 0, 0); хак, который продемонстрирован в этой статье, но ни один из них не принес успеха.

Мне интересно, может ли кто-нибудь лучше меня знать, что здесь может происходить и как это потенциально можно исправить. Реальная проблема в том, что, похоже, это происходит только в приложении Salesforce 1 на устройствах iOS, поэтому не уверен, насколько легко будет воспроизвести это в общем контексте… Но надеюсь, что у кого-то есть идея предотвратить это.

Обычные браузеры и Android кажутся просто прекрасными, это появилось только с iOS.

Я также не мог заметить ничего странного, происходящего в CSS при проверке выпадающего списка, когда он исчезал, затем, если я изменил CSS в инструментах разработчика, все это внезапно отобразилось и работало нормально. Это начинает выглядеть как какая-то проблема с рендерингом iOS, которая, кажется, находится вне моего контроля, поскольку я не смог найти какой-либо CSS, который останавливает это…

Комментарии:

1. Это действительно похоже на ошибку рендеринга iOS, класс ошибок, которые может быть очень сложно диагностировать и исправить. Вы могли бы попробовать придать элементу непрозрачность 0,99, которая работала для меня в прошлом.

2. К сожалению, у меня это не сработало. Я надеюсь, что кто-то сталкивался с чем-то подобным и может попробовать некоторые приемы CSS или что-то еще, что в конечном итоге сработает, lol. Я боюсь, что они могут работать только в браузере, но в приложении Salesforce Salesforce делает какой-то мусор, который делает его бесполезным…

3. Да, я предполагаю, что приложение использует встроенный браузер (вероятно, какую-то версию WebKit), но, возможно, оно не обновлялось некоторое время.

Ответ №1:

Я, наконец, нашел что-то, что работает для такого рода проблем.

В каждом из событий «открыть» для моих мультиселектов и выпадающих виджетов kendo я прикрепил событие «прокрутки» к k-list-scroller элементу выпадающего списка / мультиселекта. Затем событие прокрутки увеличило бы z-индекс при каждом запуске прокрутки. Это привело к повторному отображению выпадающего элемента, и он больше не исчезал.

В выпадающем списке есть небольшое изменение на долю секунды, поскольку оно быстро исчезает и появляется снова из-за изменения z-индекса.

Некоторые странные примечания: * Я не смог увеличить z-индекс, а затем вернуть его к исходному z-индексу. По какой-то причине это не вызывало повторной отправки… Мне просто приходилось постоянно увеличивать z-индекс.

* Я также не смог применить событие прокрутки, а затем удалить. Изначально я хотел применить событие прокрутки при открытии, при первом прокручивании выполнить повторный запуск с z-индексом, затем удалить событие прокрутки. Затем повторно примените событие прокрутки, если выпадающий список был открыт снова. Это привело к тому, что оно сработало только в первый раз, хотя событие прокрутки должно было применяться каждый раз, когда выпадающий список был открыт. Мне просто нужно было применить событие прокрутки и оставить его (это было во всплывающем редакторе, поэтому элементы все равно были уничтожены позже).