CSS to simulate day and night
Katherine Gallia today wrote an interesting article on how to use a timed CSS code to simulate the change of light throughout the day. The concept is very creative. She creates six sets of themes to simulate each phase: sunrise, morning, noon, afternoon, sunset and twilight. Cheers to Katherine!
Below is the code:
<SCRIPT LANGUAGE="JavaScript"> <!-- Begin function getCSS() { datetoday = new Date(); timenow=datetoday.getTime(); datetoday.setTime(timenow); thehour = datetoday.getHours(); if (thehour > 20) display = "tree_twilight.css"; else if (thehour > 17) display = "tree_sunset.css"; else if (thehour > 14) display = "tree_afternoon.css"; else if (thehour > 11) display = "tree_noon.css"; else if (thehour > 7) display = "tree_morning.css"; else if (thehour > 4) display = "tree_sunrise.css"; else if (thehour > 1) display = "tree_twilight.css"; else display = "tree_sunset.css"; var css = '<'; css+='link rel="stylesheet" href=' + display + ' \/'; css+='>'; document.write(css); // End --> } </script> <script language="javascript">getCSS();</script>
Comments (0)
Trackbacks (0)
Leave a comment
Trackback