Computer Hope

Other Pages

Home
Site map
Computer help

Dictionary
News
Q&A
What's new

Tools

E-mail this page
Print Preview
Edit this page




 

Change background color depending on time of day

Example

The below source code will change the background color of a page depending upon the color of the day.

As you can see in this example, the page will be a different color reflecting the time of day.

Source code

<script>
<!--
//Feel free to copy and modify this script, but please keep the comment lines!
//Written by Mattias Sjberg 8/8-1996
//-----------------------------------------
//| mattias.sjoberg@swipnet.se |
//|---------------------------------------|
//| //\\ //\\ /// | |
//| // \\// \\ / | Advertise |
//|// \\ /// | |
//| Mattias / | Here |
//| Sjoberg /// | |
//|---------------------------------------|
//| www.geocities.com/SiliconValley/7116 |
//| Vote for my page the above URL |
//-----------------------------------------


var now = new Date();
var hours = now.getHours();
var psj=0;

//18-19 night
if (hours > 17 && hours < 20){
document.write('<body bgcolor="orange" text="#FFFFFF">')
}

//20-21 night
if (hours > 19 && hours < 22){
document.write('<body bgcolor="orangered" text="#FFFFFF">')
}

//22-4 night
if (hours > 21 || hours < 5){
document.write('<body bgcolor="black" text="#FFFFFF">')
}

//9-17 day
if (hours > 8 && hours < 18){
document.write('<body bgcolor="deepskyblue" text="#FFFFFF">')
}

//7-8 day
if (hours > 6 && hours < 9){
document.write('<body bgcolor="skyblue" text="#FFFFFF">')
}

//5-6 day
if (hours > 4 && hours < 7){
document.write('<body bgcolor="steelblue" text="#FFFFFF">')
}


//-->
</script>

Index

Category:
Cool Tricks

Companies:
None

Related Pages:
HTML Help

Resolved

Were you able to locate the answer to your questions?

Home - Computer help - Contact - Dictionary - Links
Link to Computer Hope - Bookmark Computer Hope