.box{
width: 100px;
height: 100px;
background: orange;
animation-name: move;
animation-duration: 1s;
animation-direction: alternate;
}
@keyframes move {
0% {
transform: none;
animation-timing-function: linear;
}
80% {
transform: translateX(200px) rotate(360deg);
}
100% {
transform: translateX(300px) rotate(360deg);
}
}
上記ではアニメーションが戻りませんでした。
animation-direction: alternate;はanimation-iteration-count: infinite;
と一緒に使うことを前提にしていますか?
この回答を見るにはプレミアムプランへの登録が必要です
プレミアムプランとは?