jQuery函数循环更改背景图像崩溃firefox

Question

我希望背景图像淡出.

我有两个div在彼此之上,背景设置为图像.

在我的jQuery中,我定位一个div,然后将不透明度显示为零,显示另一个.然后我反过来.但是,这是有效的,但现在由于某种原因,这个无限循环崩溃了Firefox.

我该怎么做才能让它不崩溃？

             $(document).ready(function() {
                function change (){
                  $('#back1').animate({opacity:0}, {duration:3000});
                  $('#back1').delay(1000);
                  $('#back1').animate({opacity:1},  {duration:3000});
                  $('#back1').delay(1000);
                  change();

                }

                change();

            });

Answer 1

问题是您change()在动画完成之前调用,因此您正在创建竞争条件.动画是异步的.动画有一个完整的回调你可以使用.

试试这个:

function change (){
     $('#back1').animate({opacity:0}, {duration:3000}) 
                .delay(1000)
                .animate({opacity:1},  {duration:3000}, function(){
                      /* use complete callback of final animation to start sequeunce again*/
                      change();
                 });                  

}