按时间旋转身体的背景图像

Rotate Background Image of Body by Time

本文关键字：背景 图像 转身 时间 旋转      更新时间：2023-09-26

有人能帮我做一个简单的javascript来获取元素体，这样我就可以改变它的风格，每X秒改变背景图像?

您将需要三件东西(其中两件已经在其他答案中提到):

  1. 内置函数setInterval()，每X秒触发一个handler函数。
  2. 表达式document.body，它为body元素提供了对DOM对象的直接引用。
  3. 传递给setInterval()的函数，用于在图像之间切换。这可能需要一些数据结构来记住要切换的图像列表。
例如:

var images = ['./image1.jpg', './image2.jpg'];
var curImage = 0;
function switchImage()
{
    curImage = (curImage + 1) % images.length
    document.body.style.backgroundImage = 'url(' + images[curImage] + ')'
}
window.setInterval(switchImage, numSeconds * 1000);

设置一个切换背景的函数，并添加一个间隔。背景包含在数组bgArr中。

bgArr = ['images/bg1.jpg', 'anotherdir/bg2.jpg', 'otherone/bg3.jpg'];
bgCur = 0;
backgroundSwitch = function()
{
    if (bgCur == bgArr.length) bgCur = 0;
    document.body.style.backgroundImage = 'url('+ bgArr[bgCur++]+ ')';
}
window.setInterval(backgroundSwitch, 30000); // Switch every 30 seconds.

check out setInterval

setInterval(function () {
    document.body.style.backgroundImage = new_image;
}, 3000);
相关文章：