每10秒改变一次身体背景

Question

我正在寻找一个非常简单和轻量级的代码，每10秒更改一次网站的主体背景（它也可以和CSS一起），它应该是jQuery和CSS，对吗？

我该怎么做？

Answer 1

您可以使用JavaScript的setTimeout（）函数。这里是一个如何使用它的例子。

对于setTimeout（），您需要2个参数，一个是您的函数，另一个是整数，这是您的超时时间将持续多长时间。

所以对于你的情况，你可以这样做：

$(function() { 
    var newBg = ['img1.png', 'img2.jpg', 'img3.png']; 
    var path="img/"; 
    var i = 0; 

    var changeBg = setTimeout(function() { 
     $('body').css({backgroundImage : 'url(' path + newBg[i] + ')'}); 
     if(i == newBg.length) 
      i=0; 
     else 
      i++; 
    }, 10000); 
}); 

这将创建您的图像，与路径指定的数组。因此，我创建了一个变量来检查arrayList的长度，以及是否需要重置变量i。

，所以我希望帮助:)

Answer 2

定制background.js是一个轻量级的jQuery插件，允许用户更改网站的默认背景，将保存到本地存储的背景。这个插件可以很容易地添加到任何网站或网络应用程序，而不会对网站性能造成任何影响。

https://github.com/CybrSys/custom-background.js

Answer 3

您可以轻松地用jQuery做到这一点。

一个简单的JavaScript函数两种颜色每X秒 功能toggle_color（颜色1，颜色2，CYCLE_TIME，WAIT_TIME）{

setInterval(function first_color() { 
    $("body").animate({ 
     backgroundColor: color1 
    }, 1000, function() { 
     setTimeout(change_color, wait_time); 
    }); 
}, cycle_time); 

function change_color() { 
    $("body").animate({ 
     backgroundColor: color2 
    }, 1000, function() { 
     setTimeout(function() {}, wait_time); 
    }); 
} 
} 

之间切换，您可以检查Changing background color every X seconds in Javascript的工作演示和解释。