- ベストアンサー
指定した「曜日」の「時刻」に違うＨＴＭＬを表示させるプログラム・２
- 指定した曜日と時刻によって異なるHTMLを表示させるプログラムを作成したいです。
- ジャバスクリプトのタグ内ではなく、フレームまたはアイフレーム内で指定した場所にHTMLを表示したいです。
- テレビ局のサイトのように、曜日の特定の時刻で特定の場所に要素を表示させたいです。
- chiroru2004
- お礼率63% (111/176)
- JavaScript
- 回答数4
- ありがとう数3
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
<script type="text/javascript"> var date,h,w,jump; function autoJump(){ date = new Date(); h = date.getHours() * 3600 + date.getMinutes() * 60 + date.getSeconds(); w = date.getDay(); if(h >= 0 && h < 21600){ jump = w + '1'; } else if(h > 21601 && h < 43200){ jump = w + '2'; } else if(h > 43201 && h < 64800) { jump = w + '3'; } else { jump = w + '4'; } location.replace('#' + jump); parent.top.scroll(0,0); } </script> こんなのでどうでしょう。 ちょっと嫌な感じもありますが。 設定の変更はプログラムを理解して適当に書き直してください。 javascriptに書かれている h は0時0分0秒を 0秒とした一日の秒数が入ります。 １分は60秒なので60(秒) １時間は60(秒)×60(分)で3600(秒) １日は60(秒)×60(分)×24(時間)で86400(秒)です。 午前3時0分0秒は 3×3600 秒です。 つまり if(h >= 0 && h < 10800){ alert('午前０時～午前３時'); } って感じです。 wは曜日の番号が入っています。 日曜日なら0 月曜日なら1 火曜日は2・・・と順番に進み土曜日が6になります。 if(h >= 0 && h < 21600){ jump = w + '1'; } else if(h > 21601 && h < 43200){ jump = w + '2'; } この場合、日曜日の午前０時～午前６時(21600秒)なら jump = 0 + '1'; となって、jumpには 01 が入ります。 水曜日の午前７時頃なら 32 です。 その後 location.replace('#' + jump); の部分で<a name="01"></a>や<a name="32"></a>にジャンプします。 Iframeが記載されたページもその場所へジャンプした後で parent.top.scroll(0,0); こいつで先頭の位置に戻しています。 ちょっとガタつくのが気になるかもですが、あまり良い方法が思いつきませんでした。 ということで、 １．if else文の追加 ２．適当な時間番号の編集 ３．<a name""></a>タグの追記 あたりで出来るんじゃ無いかと思います。
その他の回答 (3)
- みずの（@mizuno3）
- ベストアンサー率73% (192/263)
たびたびすいません。再修正です。 <script type="text/javascript"> var date,h,w; function autoJump(){ date = new Date(); h = date.getHours() * 3600 + date.getMinutes() * 60; w = date.getDay(); if(h > 1 && h <= 21600){ w = w + '1'; }else if(h > 21600 && h <= 43200){ w = w + '2'; } else if(h > 43200 && h <= 64800) { w = w + '3'; } else { w = w + '4'; } location.href('#' + w); } </script>
お礼
早速ありがとうございます！素晴らしいです。 しかし、できればもう２つ教えていただきたいのですが・・・ １．アイフレーム内に開くようにしたら、アイフレームを置いたページまで<a neme="">部分に一緒に移動してしまいます。これを防ぐ方法はあるでしょうか。 ２．時間帯が現在、0時～6時/7時～12時/13時～18時/14時～23時 と、なっていますが、これを変更および追加するためには、どこを書き換えればいいでしょうか。 度々お手数おかけして申し訳ありません。 よろしくお願いします m(＿)m
- みずの（@mizuno3）
- ベストアンサー率73% (192/263)
<script type="text/javascript"> var date,h,jump; function autoJump(){ date = new Date(); h = date.getHours() * 3600 + date.getMinutes() * 60; w = date.getDay(); if(h > 1 && h < 21600){ w = w + '1'; }else if(h > 21601 && h < 43200){ w = w + '2'; } else if(h > 43201 && h < 64800) { w = w + '3'; } else { w = w + '4'; } location.href('#' + w); } </script> こうですね。すいません。
- みずの（@mizuno3）
- ベストアンサー率73% (192/263)
<html> <head> <script type="text/javascript"> var date,h,jump; function autoJump(){ date = new Date(); h = date.getHours() * 3600 + date.getMinutes() * 60; w = date.getDay(); if(h > 1 && h < 21600){ w = w + '1'; }else if(h > 21601 && h < 43200){ w = w + '2'; } else if(h > 21601 && h < 43200) { w = w + '3'; } else { w = w + '4'; } location.href('#' + w); } </script> </head> <body onload="autoJump()"> <table> <tr><td>日曜日</td></tr> <tr><td><a name="01"></a>0時～6時</td></tr> <tr><td><a name="02"></a>7時～12時</td></tr> <tr><td><a name="03"></a>13時～18時</td></tr> <tr><td><a name="04"></a>14時～23時</td></tr> </table> <table> <tr><td>月曜日</td></tr> <tr><td><a name="11"></a>0時～6時</td></tr> <tr><td><a name="12"></a>7時～12時</td></tr> <tr><td><a name="13"></a>13時～18時</td></tr> <tr><td><a name="14"></a>14時～23時</td></tr> </table> <table> <tr><td>火曜日</td></tr> <tr><td><a name="21"></a>0時～6時</td></tr> <tr><td><a name="22"></a>7時～12時</td></tr> <tr><td><a name="23"></a>13時～18時</td></tr> <tr><td><a name="24"></a>14時～23時</td></tr> </table> <table> <tr><td>水曜日</td></tr> <tr><td><a name="31"></a>0時～6時</td></tr> <tr><td><a name="32"></a>7時～12時</td></tr> <tr><td><a name="33"></a>13時～18時</td></tr> <tr><td><a name="34"></a>14時～23時</td></tr> </table> <table> <tr><td>木曜日</td></tr> <tr><td><a name="41"></a>0時～6時</td></tr> <tr><td><a name="42"></a>7時～12時</td></tr> <tr><td><a name="43"></a>13時～18時</td></tr> <tr><td><a name="44"></a>14時～23時</td></tr> </table> <table> <tr><td>金曜日</td></tr> <tr><td><a name="51"></a>0時～6時</td></tr> <tr><td><a name="52"></a>7時～12時</td></tr> <tr><td><a name="53"></a>13時～18時</td></tr> <tr><td><a name="54"></a>14時～23時</td></tr> </table> <table> <tr><td>土曜日</td></tr> <tr><td><a name="61"></a>0時～6時</td></tr> <tr><td><a name="62"></a>7時～12時</td></tr> <tr><td><a name="63"></a>13時～18時</td></tr> <tr><td><a name="64"></a>14時～23時</td></tr> </table> </body> </html> 楽しそうなので書いてみました。 こんなのでどうでしょうか。
お礼
何度もありがとうございます！ 本当に助かります。おかげさまでＩＥではうまく表示しました。 「ガタつき」は殆ど気になりませんでした。 あと一歩のところまで来ました。 ・・・ので最後に可能であれば 「Ｏｐｅｒａでもうまく表示される方法」を 教えていただけないでしょうか。 私はデフォルトのブラウザはオペラを使っているのですが、このプログラムを追加してオペラで開こうとすると ページが脈うつ？ようになって止まらないんです。 お忙しいでしょうからとても無理は言えませんが 余力がありましたらよろしくお願いします・・ この質問はとりあえず１２/１６（金）に締切ります。