如何使用此javascript自动更新背景颜色?

时间:2014-05-07 01:08:52

标签: javascript

以下javascript应该根据当前时间调整背景颜色,分钟,秒和小时发生不同的变化。

现在,只有每次重新加载页面时才会发生更改。

如何随着时间的变化动态发生变化?

var body = document.getElementById("body");
var minute = 0;


function currentTime() {
    var today = new Date();
    console.log(today);
    hour = today.getHours();
    minute = today.getMinutes();
    second = today.getSeconds();

    console.log(minute);
}

function changeColor() {
    console.log("Minute: " + second);
    color_valueR = Math.floor(second * 2.25); // scale up to 255 and convert to integer
    color_valueG = Math.floor(minute * 3.25); // scale up to 255 and convert to integer
    color_valueB = Math.floor(hour * 4.25); // scale up to 255 and convert to integer

    rgb = "rgb(" + color_valueR + ", " + color_valueG + ", " + color_valueB + ")"; // create RGB string
    console.log(rgb);
    document.getElementsByTagName("body")[0].style.background = rgb; // set background color
}

function setScene() {
    currentTime();
    changeColor();
}

window.addEventListener("load", setScene, false);

1 个答案:

答案 0 :(得分:0)

只加载一次;相反,你想设置一个间隔,它经常重复调用代码,例如:

setInterval(function() { changeColor(); }, 1000); //1000= 1 second

您可以调用方法来检查和设置颜色。