jquery - 需要重复我的动画功能

Question

我需要制作一些云效果并循环此效果，我需要制作一些 div 并将它们从左到右移动，就像我的代码一样。但我的问题是我无法重复该功能:(任何帮助

var windowWidth = $(window).width();

                $(document).ready(function () {
                      $("#cloud").animate({
                          left: "-50"
                          },9000, "linear", function () {
                       $("#cloud").delay(50).animate({
                                   left: windowWidth },9000,"linear");
                          });
                });

Answer 1

jQuery .animate() 接受一个回调函数，该函数会在动画完成时触发。

$(document).ready(function () {
    var $cloud = $('#cloud'),
        animateCloud = function() {
            var direction = $cloud.css('left').slice(0,1) === '-' ? '0px' : '-50px' 
            $cloud.animate({left: direction}, 9000, "linear", animateCloud);
        };
    animateCloud();
});

示例：http: //jsfiddle.net/XVzk4/