CSS3动画中的animation-play-state属性可以控制动画的暂停和继续，动画往往需要类似:hover效果来触发，但是当动画还未执行完成:hover状态就消失的时候，动画会结束然后生硬的跳回初始状态。使用animation-play-state可以是动画在:hover状态消失的时候暂停，再次:hover的时候继续执行动画。
.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;
}
}
