如何在没有JavaScript库的情况下检测转换结束？

Question

我想在完成CSS转换动画后删除一个对象,但我无法使用JavaScript库.

如何检测动画何时完成？我是否以某种方式使用回调或自定义事件？

Answer 1

element.addEventListener('transitionend', function(event) {
    alert("CSS Property completed: " + event.propertyName);
}, false );

目前,确切的事件名称尚未标准化.以下是MDN的引用:

转换完成时会触发一个事件.
在所有符合标准的浏览器中,事件是transitionend,
在WebKit中webkitTransitionEnd.

这是Webkit的小提琴:http://jsfiddle.net/bNgWY/