Javascript HTML5无休止的背景动画

我有一个动画背景图像

我怎样才能做无休止的动画

若动画出现在页面的右侧，我希望看到它出现在页面的左侧

源代码

@关键帧动画背景{ 从{ 背景位置：0； } 到{ 背景位置：100%0； } } 动画区域{ 宽度：560px； 高度：400px； 背景图像：urlhttps://davidwalsh.name/demo/bg-clouds.png; 背景位置：0px 0px； 背景重复：重复-x； 动画：动画背景40秒线性无限； }

---

我发这个是因为你说从左到右。 你可以用这样的东西

横轴{ 宽度：1439px； 高度：1170px； 背景：黑色urlhttps://assets.periscope.tv/images/map.svg; -webkit动画：背景滚动50秒线性无限； 动画：背景卷轴50秒线性无限； } @-webkit关键帧背景滚动{ 从{ 背景位置：-1439px 0； } 到{ 背景位置：0； } } @关键帧背景滚动{ 从{ 背景位置：-1439px 0； } 到{ 背景位置：0； } }

---

谢谢，可以工作，但我怎样才能使它像：。e：背景图像动画在你的回答中重新启动如果你喜欢，我可以使它与颜色相同。我不知道你是想看看它是怎么工作的还是复制品。

@keyframes customname 
{
    from { background-position: 0 0; }
    to   { background-position: 100% 0; }
}


classname
{   
    background-image: url(Url of tyour file);
    width: width of the file; 
    height: Height of the file; 
    background-position: 0px 0px;
    background-repeat: repeat-x;  //Repeating through X axis only 

    animation: customname 40s linear infinite; 
}