時間帯によって背景の画像をかえてみよう
表示の例
 ボタンを押すとウインドウが開き、時間帯によって背景の画像がかわります。
午前5時〜午前10時 午前10時〜午後5時 午後5時〜午後11時 午後11時〜午前5時
プログラムAのソースをコピーして、HTMLソースのBODY区間に貼り付けしましょう。できるだけ上のほうがいいので、<body>タグのすぐ下あたりに貼り付けましょう。
プログラムAのソース
<SCRIPT LANGUAGE="JavaScript">
<!--
myTime=(new Date()).getHours();
if(myTime>=5 && myTime<10){
myBack="images/back09.gif";
}else if(myTime>=10 && myTime<17){
myBack="images/back08.gif";
}else if(myTime>=17 && myTime<23){
myBack="images/back07.gif";
}else if(myTime<5 || myTime>=23){
myBack="images/back010.gif";
}
document.write("<body background='"+myBack+"'>");
//-->
</SCRIPT>
プログラムAのソースの上から4行目の if(myTime>=5 && myTime<10) が朝の時から10時までの設定をしているところです。
そのすぐ下の行の myBack="images/back09.gif"; の images/back09.gif がその時間に表示される背景画像ですから、あなたの表示させたい背景画像のファイル名にかえてください。
さらにその下の行には、ほかの時間帯のプログラムが書かれています。10時から17時(夕方の5時)までは images/back08.gif が表示されて、17時から23時(夜の11時)までは images/back07.gif が、23時から朝の5時までは images/back010.gif が表示されます。それぞれの背景画像ファイル名を、あなたの表示させたい背景画像のファイル名にかえてください。
時間帯の設定をかえてみてもいいと思いますが、かえる場合には時間帯がかさならないようにしてくださいね。
ソースの文字をかえる時に、" や ; を消してしまわないようにしてください。
5・6年生にもわかるやさしいJavaScriptのTOPへ