我想从暂停的CSS动画开始,然后使用jQuery运行动画一秒钟,然后再次暂停.
css如下:
#animation {
-webkit-animation: one 5s infinite;
-webkit-animation-play-state: paused;
}
@-webkit-keyframes one {
0% { .... }
.....
100% { .... }
}
它有一些复杂的关键帧,目的是它会在1秒内播放到20%的位置然后停止.
我尝试了下面的jQuery,但它不起作用:
$("#click").click(function(){
$("#animation").css("-webkit-animation-play-state","running").delay(1000).css("-webkit-animation-play-state","paused");
});
(#click是我想用作动画触发器的div)
如果我删除延迟和后续暂停它工作正常但显然继续循环.
例如:
$("#click").click(function(){
$("#animation").css("-webkit-animation-play-state","running");
});
你会有什么好人建议的?