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

我想要背景图像淡入淡出

我有两个div，背景设置为一个图像

在我的jQuery中，我以一个div为目标，然后将不透明度设置为零，显示另一个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();

            });

---

问题是您在动画完成之前调用了

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();
                 });                  

}

---

问题是您在动画完成之前调用了

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();
                 });                  

}

---

您必须使用函数的回调

您必须使用函数的回调

Hmnn它不会崩溃，但它只循环一次。我在这里添加了

setTimeout

以补偿最后的延迟丢失。不要多次调用

$（'#back1'）

。您每次都在搜索DOM以找到它..链接动画和/或缓存selectorI根据您的建议找到它。动画（{opacity:1}，3000，function（）{$（'#back1'）.delay（1000）change（）；Hmnn它不会崩溃，但它只循环一次在这里工作我添加了

setTimeout

来补偿最后一次延迟丢失不要调用

$（'#back1'））

这么多次。你每次都在搜索DOM来找到它..链接动画和/或缓存Selector根据你的建议解决了它。你写了什么，但改变了这个“。动画（{opacity:1}，3000，function（）{$（'#back1'）。延迟（1000）改变（）；