CSS3动画完成后是否有回调?-IsthereacallbackoncompletionofaCSS3animation?

111  

Yes, there is. The callback is an event, so you must add an event listener to catch it. This is an example with jQuery:

是的,有。回调是一个事件，所以您必须添加一个事件监听器来捕获它。这是jQuery的一个例子:

$("#sun").bind('oanimationend animationend webkitAnimationEnd', function() { 
   alert("fin") 
});

Or pure js:

或纯js:

element.addEventListener("webkitAnimationEnd", callfunction,false);
element.addEventListener("animationend", callfunction,false);
element.addEventListener("oanimationend", callfunction,false);

Live demo: http://jsfiddle.net/W3y7h/

现场演示:http://jsfiddle.net/W3y7h/

3  

An easy way for you to do a callback that also handles your CSS3 transitions/browser compatibilities would be the jQuery Transit Plugin. Example:

对您来说，处理CSS3转换/浏览器兼容性的回调的一个简单方法是jQuery传输插件。例子:

//Pulsing, moving element
$("#element").click( function () {
    $('#element').transition({ opacity: 0, x: '75%' }, function () { $(this).transition({ opacity: 1, x: '0%' }).trigger("click"); });
});

JS Fiddle Demo

JS小提琴演示