0

I would like the time of day to control color with the seconds to control gradience like in the pic

var clock, hour, min, sec, color;

function displayTime(){
clock=new Date();
hour=clock.getHours(),
min=clock.getMinutes(),
sec=clock.getSeconds();

//if single digit, add 0 to the left
if(hour<=9) hour='0'+hour;
if(min<=9) min='0'+min;
if(sec<=9) sec='0'+sec;


color='#'+hour+min+sec;
//colorText=color.split().join(":");


function changeClock() {
    document.getElementById("time").innerHTML=color;
}

function returnClock() {
    document.getElementById("time").innerHTML=""+hour+":"+min+":"+sec+"";
}





//function mouseOut() {
//    document.getElementById("time").innerHTML=""+hour+":"+min+":"+sec+"";
//}

//document.getElementById("time").addEventListener("mouseout", mouseOut);

//set background color
document.body.style.background.= color;
document.getElementById('time').innerHTML=""+hour+":"+min+":"+sec+"";

//document.getElementById("time").addEventListener("mouseout", returnClock);

document.getElementById("time").addEventListener("mouseover", changeClock);


//set interval
setInterval(displayTime,1000);

}


displayTime();

Edited by jmann22

Attachments clock.gif 31.86 KB
2
Contributors
2
Replies
30
Views
2 Years
Discussion Span
Last Post by jmann22
0

in this line
document.body.style.background.= color;
you have error , you have dot after background just remove it.
document.body.style.background = color;

0

yeah i was testing out some methods and forgot to edit it back

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.