Cómo bucle .animate JQuery

Question

Estoy trabajando con un solo div con una imagen dentro. Necesito que la animación se desplace de la derecha a la izquierda de la página y luego regrese a la derecha y continúe en un bucle. Revisé muchas publicaciones aquí, pero no puedo hacer que la secuencia de comandos funcione correctamente.

'$(document).ready(function(){ 
    function loop() { 

     $('#clouds').animate({left: '+=1400',},50000, 'linear', function(){ 
      loop(); 
     }); 

HTML

< div id="clouds">< img border="0" alt="animated clouds" src="/images/clouds.png" />< /div> 

CSS

#clouds { 
    position:absolute; 
    z-index:500; 
    right:0px; 
    top:10px; 
} 

Answer 1

Prueba esto:

jsFiddlehttp://jsfiddle.net/2YqH2/

no se está moviendo las nubes de nuevo a la derecha. Dentro de la función de bucle, agregué

$('#clouds').css({right:0}); 

y el bucle continuará desde allí. También cambié tu animación para animar la propiedad "correcta" porque dijiste que querías que las nubes se movieran de derecha a izquierda.

Además, su javascript no está bien formado. ¡Asegúrate de obtener esos paréntesis de cierre y paréntesis! Aquí está el javascript arreglado.

$(document).ready(function() { 
    function loop() { 
     $('#clouds').css({right:0}); 
     $('#clouds').animate ({ 
      right: '+=1400', 
     }, 5000, 'linear', function() { 
      loop(); 
     }); 
    } 
    loop(); 
}); 

Answer 2

javascript:

$(document).ready(function() { 

    $('#clouds').click(function() { 
loop();  
    }); 

function loop(){ 
    alert('a'); 
     $('#clouds').animate({ 
      opacity: 0.25, 
      left: '+=1400', 
      height: 'toggle' 
     }, 5000, 'linear', function() { 
      loop(); 
     }); 

} 

}); 

HTML:

<div id="clouds"><img border="0" alt="animated clouds" src="../img/image.png" /></div> 

su error es que no está llamando al bucle de función nunca. mira cómo it works, puedes eliminar el alert('a') porque es solo una bandera para saber que el ciclo comienza de nuevo. ahora necesita hacer el movimiento inverso (como reiniciar el div, para comenzar el ciclo de movimiento).