イヌでもわかるJavaScript講座
|
イヌでもわかるJavaScript講座
|
|
Step.57 - 時間がくるとページを変える
|
時間がくると違うページを表示します。 |
| Step テーマ ● 現在時刻から 次の「時」0分 までの時間を求める |
実行例今回、なし。 |
リスト<script type="text/javascript"><!-- myRef = new Array(24); myRef[0]="am0.htm"; myRef[1]="am1.htm"; myRef[2]="am2.htm"; myRef[3]="am3.htm"; myRef[4]="am4.htm"; myRef[5]="am5.htm"; myRef[6]="am6.htm"; myRef[7]="am7.htm"; myRef[8]="am8.htm"; myRef[9]="am9.htm"; myRef[10]="am10.htm"; myRef[11]="am11.htm"; myRef[12]="pm0.htm"; myRef[13]="pm1.htm"; myRef[14]="pm2.htm"; myRef[15]="pm3.htm"; myRef[16]="pm4.htm"; myRef[17]="pm5.htm"; myRef[18]="pm6.htm"; myRef[19]="pm7.htm"; myRef[20]="pm8.htm"; myRef[21]="pm9.htm"; myRef[22]="pm10.htm"; myRef[23]="pm11.htm"; myHour = (new Date()).getHours(); myMin = (new Date()).getMinutes() * 60; mySec = (new Date()).getSeconds(); myNow = myMin + mySec; myNext = (3600 - myNow) * 1000; myNextHour = (myHour == 23) ? 0 : myHour+1 ; setTimeout("location.href=myRef[myNextHour]",myNext); // --></script> |
| サンプルだけの HTMLは こちらへ |
説明[Q] 0分になると 違うページにリンクしたいのですが [A] こんな感じ!? 時間がくると自動的に変えるというと、少し難しいように思えますが、あと何分したら違うページをリンクするかというと、なんか簡単な気がします。 はい、簡単です。 たとえば、いま、20:50:13 だとすると、21:00:00 までは、あと何秒かというと、えーと、えーと、9分と、えーと、47秒かな？ だとすると (^^; 、(9*60)+47 つまり、587秒後が 午後9時なわけです。 PCに、この587秒を計算させるためには、 3600 - (現在の分*60) - 現在の秒 例でいうと、 3600 - (50*60) - 13 = 587 おお、正解です (^^; 現在の時間を取得するのは、Step.3 にて説明しました。 今回は、 myHour = (new Date()).getHours(); myMin = (new Date()).getMinutes() * 60; mySec = (new Date()).getSeconds(); といった感じで、時、分、秒を取得しています。 Step.3のやりかたの方がスマートです。 myNow = myMin + mySec; myNext = (3600 - myNow) * 1000; 次の「時」は、今の「時」に 1 を足せば良いわけですが、23時の次の「時」は 24ではなく、０ですので、 myNextHour = (myHour == 23) ? 0 : myHour+1 ; となります。 次の時間は、myNextミリ秒後。 次の時間のリンク先は location.href = myRef[myNextHour] 。 もうおわかりですね いつものSetTimeout()です。 setTimeout("location.href=myRef[myNextHour]",myNext); myNextミリ秒後に、location.href = myRef[myNextHour] へリンクする。 とんでもない ページだ。。 |
 |