CSS3動(dòng)畫中的animation-play-state屬性可以控制動(dòng)畫的暫停和繼續(xù)告希，動(dòng)畫往往需要類似:hover效果來觸發(fā)樟凄，但是當(dāng)動(dòng)畫還未執(zhí)行完成:hover狀態(tài)就消失的時(shí)候楞捂，動(dòng)畫會(huì)結(jié)束然后生硬的跳回初始狀態(tài)。使用animation-play-state可以是動(dòng)畫在:hover狀態(tài)消失的時(shí)候暫停趋厉，再次:hover的時(shí)候繼續(xù)執(zhí)行動(dòng)畫寨闹。
.a{
background: url("1.png") no-repeat left top / auto 100%;
animation: bg 4s linear infinite alternate;
animation-play-state: paused;
}
.a:hover{
animation-play-state: running;
}
@keyframes bg {
to {
background-position:100% 0;
}
}
