Изменение цвета фона в зависимости от времени

Я кодирую сайт с моим другом, мы очень новичок в кодировании. Мы хотели бы, чтобы наш сайт постепенно менял цвет каждую секунду в зависимости от времени суток. Мы не знаем, где начать, кроме использования функции javascript. Пожалуйста помоги!!!! Мы закодировали часы на нашем сайтеИзменение цвета фона в зависимости от времени

function time(){ 
var today = new Date(); 
var h = today.getHours() 
if (h>12) {h= h- "12"} ; 
var m = today.getMinutes(); 
var s = today.getSeconds(); 
m = checkTime(m); 
s = checkTime(s); 
document.getElementById('clocky').innerHTML = 
h + ":" + m + ":" + s; 

var t = setTimeout(time, 500); 
} 
function checkTime(i) { 
if (i < 10) {i = "0" + i}; 
return i; 
}

Это, насколько мы получили, кроме общего HTML для часов и CSS. Как бы вы закодировали меняющийся фон в зависимости от времени?

источник

2016-02-03 Kenzie

ну, вы можете начать с 'document.body.style.backgroundColor =" red "' ... –

вы хотите случайный цвет каждую секунду или какой-то переход радуги ??? – Aziz

Вид перехода радуги, но с разными оттенками каждого цвета, поэтому они выдерживают приличное количество времени. Цель состоит в том, чтобы не повторять цвет. – Kenzie

https://jsfiddle.net/f9b9sbr4/1/

function time(){ 
    var today = new Date(); 
    var h = today.getHours() 
    if (h>12) {h= h- "12"} ; 
    var m = today.getMinutes(); 
    var s = today.getSeconds(); 
    m = checkTime(m); 
    s = checkTime(s); 
    document.getElementById('clocky').innerHTML = h + ":" + m + ":" + s; 
    var r = parseInt(s) * 1; 
    var g = parseInt(s) * 3; 
    var b = parseInt(s) * 5; 
    document.body.style.backgroundColor = 'rgb(' + r + ',' + g + ',' + b + ')'; 
    var t = setTimeout(time, 500); 
} 

function checkTime(i) { 
    if (i < 10) {i = "0" + i}; 
    return i; 
} 

time();

источник

2016-02-03 23:39:54

Это зависит от секунд, и, как сказал Даниил, вы можете рассказать о любом из параметры с обеих сторон: красный, зеленый, синий и часы, минуты, секунды. –

Когда я это делаю, мои часы перестают работать – Kenzie

Что значит, что это не работает? http://g.recordit.co/hkgYmz6uJH.gif –

Ну, теперь вам нужно будет принять некоторые решения.

CSS позволяет определить цвета в формате RGB, используя числовые значения 0-255 (например background-color: rgb(0,0,0) для черного фона и background-color: rgb(255,255,255) на белом фоне.

Предполагая, что вы хотите использовать этот метод для определения цвета , вам нужно решить, как вы хотите, текущее время для сопоставления этих значений. После того, как вы выяснили, что, все, что вам нужно сделать, это установить цвет фона стиль на <html> элемент.

источник

2016-02-03 23:39:00

Изменение цвета фона в зависимости от времени

ответ

Смежные вопросы