@keyframes myAnimation {
from {
width: 10%;
}
to {
width: 100%;
}
}
我想实现如下效果:
鼠标指针移动上去( hover ),开始播放动画,宽度从 10%增长到 100%,鼠标移出,播放反转动画,宽度从 100%减少到 10%。
但是现在有个问题,当鼠标移上去时间不足 1s (宽度还没增长到 100%,假设此时宽度为 60%)就移出,此时的反转动画不是从当前位置(宽度 60%)反转,而是从 100%宽度开始反转播放,如何解决此问题?