我在15%加上了background变成绿色,我以为当runing停止播放时,会突然变回黄色,可是没有变动,请问原始应该是什么时候的状态?
既然用到了runing,那代码肯定有animation-play-state:paused;,你应该是hover的时候才running,当你鼠标移开的时候并不会回到原始状态,而是因为animation-play-state:paused二停留在当前状态。
原始状态,应该是0%时的状态
你的问题可以这样解决,
span{
display: inline-block;
width: 20px;
height: 20px;
background: orange;
transform: translateY(90px);
animation-name: move;
animation-play-state:paused;
}
div:hover span {
animation-name: move;
animation-duration: 10s;
animation-timing-function: ease-in;
animation-delay: .2s;
animation-iteration-count:infinite;
animation-direction:alternate;
animation-play-state:running;
}