transitionend от нескольких анимаций
Здравствуйте.
У меня есть транзишын: transition: width .3s, height .3s, left .3s, top .3s; Я вешаю на это обработчик: obj.box.addEventListener("transitionend", Show, false); И конечно он срабатывает 4 раза. Возможно ли вешать обработчик только на transitionend с определенным propertyName или единственное решение, которое я нашел в сети: function Show(e) { if (e.propertyName == 'width') { ... } } действительно единственное? Спасибо. |
Чтобы не проверять свойство, можно удалять обработчик события после первого срабатывания
element.addEventListener("transitionend", function callback() { element.removeEventListener("transitionend", callback); … }); Интереснее ситуация, когда время анимации разное, как определить тогда, что все анимации закончились? |
Хм, интересный ход, спасибо.
Кстати, а есть ли разница, обявлен ли обработчик в теле какой-то функции или, так сказать, в голом скрипте? И что с ним происходит после того, как эта функция выполнилась и вернула результат? И нужно ли разуплотнять обработчик обязательно в теле той же самой функции или пофиг? Спасибо. |
Без разницы где. Если на него не останется ссылок, сборщик мусора его удалит из памяти. Можно и так расписать:
function unbind() { element.removeEventListener("transitionend", onTransitionEnd); } function onTransitionEnd() { unbind(); } element.addEventListener("transitionend", onTransitionEnd); |
Ясно. Спасибо вам большое.
|
кстати, есть событие animationend
|
Да нет, решение с удалением обработчика внутри него же мне подходит идеально. Спасибо.
|
Цитата:
getComputedStyle(element).transitionDuration getComputedStyle(node).transitionDelay |
Часовой пояс GMT +3, время: 11:28. |