Задержка браузера с использованием setInterval и анимации цвета фона

Question

Я использую плагин jQuery Color для получения постоянно анимируемого фона.

Мой код такой:

$(document).ready(function()
            var $body = $('body');
            function initAnimation() {
                setInterval(colorAnimation, 12000);
            }
            function colorAnimation() {
                $body
                .animate({                                                                                                                                
                    backgroundColor: '#C5E8E8'
                }, 6000)
                .animate({ 
                    backgroundColor: '#E8C5C5'
                }, 6000);
            }
});

Предполагается, что он исчезает из одного цвета фонак другому и обратно.

Но и Chrome, и Firefox начинают использовать много ресурсов.Кроме того, для запуска анимации требуется некоторое время, поэтому я считаю, что я делаю это неправильно.Есть предложения?

Answer 1

Почему бы просто не использовать обратные вызовы?Вы, наверное, складываете анимационные события:

 function animateBackground()
 {
     $('body').animate({
          backgroundColor: '#C5E8E8'
     }, 6000, 'linear', function()
     {
          $(this).animate({
              backgroundColor: '#E8C5C5'
          }, 6000, 'linear', function()
          {
              animateBackground();
          }
     });
 }