css3动画衔接播放
1.css中用逗号分隔两个动画名称和设置。
animation-name:bounceIn,flash;
animation-duration: 1s,1s;
animation-timing-function: ease,linear;
animation-delay: 0s,1s;
animation-iteration-count: 1,infinite;
这是忽略兼容性的写法,其中animation-delay需要计算动画延迟时间。
2.监听动画结束。
$(".ib").get(0).addEventListener("webkitAnimationEnd", function() { $(".ib").removeClass("rotateIn"); $(".ib").addClass("flash"); $(".ib").addClass("infinite"); })