JavaScriptで背景の色や文字の色を時間によって変えたり、
背景の画像を一定時間ごとに変えるプログラムを書いた。
使った主なメソッドをまず簡単に説明する。
eval(s) ：sという文字列を数値に変換する。
charAt(i) ：文字列の中のi番目の文字を返す。
document.fgColor="#aaaaaa"：文字の色を指定する
document.bgColor="#ffffff"：背景の色を指定する。
document.body.background = "画像のURL"：URLにある画像ファイルを背景に設定する。
setTimeout("関数",ミリ秒) ：一定時間(ミリ秒)後に命令(関数)を呼び出すタイマーを設定する。
以下のコードを拡張子をhtmlで保存してブラウザで開くと実際に動作すると思う。
<html>
<title>CLOCK</title>
<head>
<script language="JavaScript">
function clock(){
c = new Date();
h = c.getHours();
m = c.getMinutes();
s = c.getSeconds();
document.clockForm.digitalClock.value=h+":"+m+":"+s;
color_set="0123456789abcdef"
if(eval(s) < 16){
i = eval(s);
c=color_set.charAt(i);
d=color_set.charAt(15-i);
document.fgColor="#"+d+d+"00"+c+c;
document.body.background = "";
document.bgColor="#"+c+c+"00"+d+d;
}else if(eval(s) < 20){
document.fgColor="#ffffff";
document.body.background = "http://f.hatena.ne.jp/images/fotolife/k/kiyo560808/20090211/20090211211001.jpg";
}else if(eval(s) < 28){
document.fgColor="#aaaaaa";
document.body.background = "http://f.hatena.ne.jp/images/fotolife/k/kiyo560808/20090211/20090211210958.jpg";
}else if(eval(s) < 36){
document.fgColor="#aaaaaa";
document.body.background = "http://f.hatena.ne.jp/images/fotolife/k/kiyo560808/20090211/20090211210954.jpg";
}else if(eval(s) < 45){
document.fgColor="#aaaaaa";
document.body.background = "http://f.hatena.ne.jp/images/fotolife/k/kiyo560808/20090211/20090211211000.jpg";
}else if(eval(s) < 52){
document.fgColor="#aaaaaa";
document.body.background = "http://f.hatena.ne.jp/images/fotolife/k/kiyo560808/20090211/20090211210953.jpg";
}else{
document.fgColor="#ffff00";
document.body.background = "http://f.hatena.ne.jp/images/fotolife/k/kiyo560808/20090211/20090211211921.jpg";
}
setTimeout("clock()",500);
}
</script>
</head>
<body>
<center><h2><b>CLOCK</b></h2></center>
<form name="clockForm">Current Time：
<input size="10" name="digitalClock">
</form>
<script language="javascript">
//<![CDATA[
clock();
//]]>
</script>
</body>
</html>
お読み頂きありがとうございます。
少しでもお役に立てたらクリックお願いします↓。
