событие перехода
Пример
Сделайте что-нибудь с элементом <div>, когда переход CSS закончился:
// Code for Safari 3.1 to 6.0
document.getElementById("myDIV").addEventListener("webkitTransitionEnd", myFunction);
// Standard syntax
document.getElementById("myDIV").addEventListener("transitionend", myFunction);
Определение и использование
Событие перехода происходит, когда переход CSS завершен.
Примечание. Если переход удаляется до его завершения, например, если удаляется свойство CSS transition- property, событие перехода не срабатывает.
Для получения дополнительной информации о переходах CSS см. наш учебник по переходам CSS3 .
Поддержка браузера
Цифры в таблице указывают на первую версию браузера, полностью поддерживающую событие.
Цифры, за которыми следует «webkit», «moz» или «o», указывают первую версию, которая работала с префиксом.
Event | |||||
---|---|---|---|---|---|
transitionend | 26.0 4.0 (webkitTransitionEnd) |
10.0 | 16.0 4.0 (mozTransitionEnd) |
6.1 3.1 (webkitTransitionEnd) |
12.1 10.5 (oTransitionEnd) |
Синтаксис
object.addEventListener("webkitTransitionEnd", myScript); // Code for Safari 3.1 to 6.0
object.addEventListener("transitionend", myScript); // Standard syntax
Примечание. Метод addEventListener() не поддерживается в Internet Explorer 8 и более ранних версиях.
Технические детали
Пузыри: | да |
---|---|
Отменяемо: | да |
Тип события: | Событие перехода |
Версия ДОМ: | События уровня 3 |
Связанные страницы
Учебник по CSS: переходы CSS3
Справочник по CSS: свойство перехода CSS3
Справочник по CSS: CSS3 свойство transition-property