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