Как повторить функцию с Javascript

Question

Это код, над которым я работал, который заставляет цвета фона мерцать.Мне интересно, если кто-нибудь знает, как сделать это повторить, чтобы фон продолжал менять цвета и снова и снова.

var a = new Array("ff", "ee", "dd", "cc", "bb", "aa", "99", "88", "77",
                  "66", "55", "44", "33", "22", "11", "00", "00", "11",
                  "22", "33", "44", "55", "66", "77", "88", "99", "AA",
                  "BB", "CC", "DD", "EE", "ff");

x = 0;

var b = new Array("ff", "ee", "dd", "cc", "bb", "aa", "99", "88", "77",
                  "66", "55", "44", "33", "22", "11", "00", "00", "11",
                  "22", "33", "44", "55", "66", "77", "88", "99", "AA",
                  "BB", "CC", "DD", "EE", "ff");

x = 0;

var c = new Array("00", "11", "22", "33", "44", "55", "66", "77", "88",
                  "99", "AA", "BB", "CC", "DD", "EE", "ff", "ff", "ee",
                  "dd", "cc", "bb", "aa", "99", "88", "77", "66", "55",
                  "44", "33", "22", "11", "00");

x = 0;

function bg_eff() {
  col_val = "#" + a[x] + b[x] + c[x];
  document.bgColor = col_val;
  x++;
  if (x == 32) {
    clearInterval(change_bg);
  }
}
change_bg = setInterval("bg_eff()", 50);

Answer 1

x = (x + 1) % 32;

Кроме того, вы должны удалить clearInterval (и связанный, если), и нет необходимости использовать строку для setInterval:

change_bg = setInterval(bg_eff, 50);

Answer 2

модифицированный код здесь (с использованием jquery)

http://jsfiddle.net/generalhenry/S8g6k/1/

Я использую рекурсивный метод setTimeout вместо интервала, таким образом, он более устойчив (если ваша функция занимает больше времени, чем интервал, ничего странного не происходит)

Answer 3

новая версия с чистым Jquery

http://jsfiddle.net/generalhenry/S8g6k/5/

Я использую .animate для более чистого кода (нет необходимости в массивах или в x ++)

ох и предупреждение: страшно поменять цвет

$("body").css("background-color","#ffff00");
var bg_eff;
(bg_eff = function(x)
{
   var duration = 1600;
   if(x)
   {
       $("body").animate({backgroundColor:"#0000ff"},duration,function(){
           bg_eff(false);
       });
   }
   else
   {
       $("body").animate({backgroundColor:"#ffff00"},duration,function(){
           bg_eff(true);
       });
   }
})(true);

Answer 4

в дополнение к ответу Мэтью, но так как массивы находятся в той же последовательности, вы можете сделать что-то вроде этого.

var a = new Array("ff", "ee", "dd", "cc", "bb", "aa", "99", "88", "77", "66", "55", "44", "33", "22", "11", "00", "00", "11", "22", "33", "44", "55","66", "77", "88", "99", "AA", "BB", "CC", "DD", "EE", "ff");  // one array
var x = 0;  // var for not global (even though in this context it still is...)
function big_eff() {
    col_val = "#" + a[x] + a[(x + 5) % 32] + a[(x + 10) % 32]; // or whatever spacing you want
    document.bgColor = col_val;
    x = (x + 1) % 32;
    setTimeout("big_eff()",50);  // setTimeout baby!
}

Answer 5

Я бы сделал это:

x += 1;
if ( x === 32 ) { x = 0; }