Блог

У меня есть 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;
}
  

У меня была такая же проблема. Попробуйте использовать timer = setTimeout(functionname to loop, 0); .

Всякий раз, когда я задаю вопрос jQuery, кто-то обычно отвечает ссылкой на какой-нибудь раздутый плагин, созданный кем-то другим. Вопрос был в том, как что-то сделать, а не в том, где что-то скачать.