Я пытаюсь сделать заставку, которая исчезает с одного экрана на другой.Это немного сложнее, когда каждая страница имеет сетки с собственными изображениями, которые постепенно исчезают между собой, но это базовая предпосылка.
Учитывая, что тайм-ауты не являются точными в ожидаемое время выполнения (они помещаются в стек и выполняются, когда они могут), я пытаюсь использовать событие transitionend
, так как мой код будет ждать, когдаанимация / переход на самом деле заканчивается и больше не будет выполнять код до тех пор.
Основная проблема, с которой я столкнулся, заключается в том, что у меня есть рекурсивный тайм-аут, который должен запускаться примерно каждые 45 секунд, что вызывает запуск всей страницыисчезать (изменять непрозрачность), чтобы показать другую страницу.Учитывая, что тайм-аут помещается в стек, выполнение этого тайм-аута отключено, поэтому для меня было бы лучше просто поместить CSS-переход на страницу, которая анимируется на 45 секунд, и как только это событие transitionend
сработает, создайте следующуюСетка заставки страница и контент.
tl; dr Есть ли какие-нибудь приемы для использования события transitionend
, когда анимация действительно заканчивается?Есть ли более эффективный способ обработки ожидания события transitionend
, кроме установки какого-либо свойства CSS для перехода в течение 45 секунд?На данный момент я просто устанавливаю opacity
элемента страницы, чтобы он менялся с 1
на 0.999
в течение 45 секунд, чтобы я мог убедиться, что получаю обратные вызовы перехода в режиме реального времени.