ヘッダー部（<HEAD>〜</HEAD>）に次の様に記述します。
<SCRIPT TYPE="text/javascript">
<!--
TimeH = (new Date()).getHours();
if (TimeH>=0 && TimeH<=4)
{myBGcolor="#000"; myColor="#ffc";}
else if (TimeH>=5 && TimeH<=7)
{myBGcolor="#fcc"; myColor="#c00";}
else if (TimeH>=8 && TimeH<=16)
{myBGcolor="#00f"; myColor="#ff0";}
else if (TimeH>=17 && TimeH<=19)
{myBGcolor="#96c"; myColor="#cc9";}
else if (TimeH>=20 && TimeH<=23)
{myBGcolor="#000"; myColor="#ff0";}
myOP = window.opera;
myN6 = document.getElementById;
myIE = document.all;
if (myOP) myBR="O6";
else if (myIE) myBR="I4";
else if (myN6) myBR="N6";
else myBR="";
function bg(){
if (myBR == "I4"){
document.all.bdy.style.background = myBGcolor;
document.all.bdy.style.color = myColor;
}
else if (myBR == "N6" || myBR == "O6") {
document.getElementById("bdy").style.background = myBGcolor;
document.getElementById("bdy").style.color = myColor;
}
}
// -->
</SCRIPT>
BODYタグに次の様に記述します。
<BODY ID=bdy onload="bg()">
- if (TimeH>=0 && TimeH<=4)
{myBGcolor="#000"; myColor="#ffc";}
が、０時〜４時５５分の時刻の背景色(#000)、文字色(#ffc)を設定しています。以下同様です。数字や色を変えてご自分のホームページに合わせて下さい。
ブラウザ対応表
| ブラウザ | IE | Netscape | Opera
|
バージョン| 5.00 | 5.50 | 6.0 | 6.2.3 | 7.01 | 6.06 | 7.21
| | 対応 | ○ | ○ | ○ | ○ | ○ | ○ | ○
| |