如何停止向左到右移动图像，然后重新开始

Question

我想在末端(右(左至右移动图像并重新开始循环。我在此网站的帮助下疲倦了

https://www.w3schools.com/cssref/tryit.asp?filename = trycss3_animation-delay

，但我无法停下来再重新开始。有人可以帮助我吗？

感谢您的宝贵时间

Answer 1

要以10秒的延迟制作5秒的动画，您将根据公式使用33％：100/(maxTime)*animationTime

div {
    width: 100px;
    height: 100px;
    background: red;
    position: relative;
    animation: mymove 15s infinite;
}
@-webkit-keyframes mymove {
    0% {left: 0px;}
    33% {left: 200px;}
    100% {left: 200px;}
}

<div></div>