一个 jQuery 图像组动画

Question

我有一个包含三个相同图像的 div。

<div>
    <img class="movlights" src="files/images/movelights.png" alt="10 years logo" />
    <img class="movlights sec" src="files/images/movelights.png" alt="10 years logo" />
    <img class="movlights third" src="files/images/movelights.png" alt="10 yearslogo"/>
</div>

每个都有不同的“绝对”位置，它们都形成一行，它们的父 div 是 溢出 - 隐藏。

因此，我使用以下代码将它们作为一组从左到右同时移动：

  $(function(){ 
    movelights();
  });

  function movelights(){
    for(x=0;x<3;x++)
    {
       $('div img:eq('+x+')').animate({left: (1400 - x*800)},24000);
    }
  };

我的问题是： 如何在通过 div 的右边缘时再次排队以使动画模式重复自身，从而在其他图像之前返回某个起始位置上的图像！

所以我对两者都感兴趣：

• 如何从末尾排队图像 行到开头
• 如何循环播放动画图案

希望我足够清楚英语不是我的母语。

这里有一些额外的代码：

div{
width:1000px;
overflow:hidden;
position:relative;
}

all img{  
  display:block;  
  position:absolute;
  left:120px;  
}
img2{  
  left:-678px;
}
img3{  
  left:-1400px;
}

Answer 1

我遇到了同样的问题。尝试使用timer = setTimeout(functionname to loop, 0);。

每当我问一个 jQuery 问题时，通常都会有人回复一个指向其他人构建的臃肿插件的链接。问题是如何做某事而不是从哪里下载。