- ベストアンサー
画像の入れ替え
JavaScriptを使って、季節や月毎にサイト上の画像（バナー等）を自動的に入れ替えることはできませんでしょうか？わかる方がいらっしゃいましたら、スクリプトを教えていただけませんでしょうか。お願いします。
- JavaScript
- 回答数2
- ありがとう数3
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
ああ・・バナーでしたね。そりゃリンクは必要ですね。 いくつか方法はあると思いますが、とりあえずはimgsと同様に urlsという配列をつくっておいて飛ばすのが妥当かと。 <html> <head> <script language=javascript> window.onload=function(){ var imgs=new Array(); imgs[0]="image00.jpg"; //0が1月 imgs[1]="image01.jpg"; //・・・ imgs[11]="image11.jpg";//11が12月 var date=new Date(); document.getElementById('banner').src=imgs[date.getMonth()]; } function jump(){ var date=new Date(); var urls=new Array(); urls[0]="http://www.google.co.jp"; //0が1月 urls[1]="http://www.yahoo.co.jp"; //・・・ urls[11]="http://www.goo.ne.jp";//11が12月 window.location.href=urls[date.getMonth()]; } </script> </head> <body> <img src="" id="banner" onClick="jump()"> </body> </html> ちなみに日付まで考慮しての意図がうまくつたわってきません。 ○月○日～×月×日の間はこの画像・・・のような範囲で管理するのですか？ そうなると単純に月にひもづけた配列では管理しきれませんので、 画像（およびリンク）を一通り配列にしていしておき、 日付をもとに場合わけをしていく（ifとかswitch）ことになります。 若干面倒ではあります。
その他の回答 (1)
- yambejp
- ベストアンサー率51% (3827/7415)
javascriptを前提とするのであれば12個画像を用意しておいて idで指定したimgタグのsrcを入れ替えればよいでしょう。 イメージはダミーを置いておいてもよいでしょう。 <html> <head> <script language=javascript> window.onload=function(){ var imgs=new Array(); imgs[0]="image00.jpg"; //0が1月 imgs[1]="image01.jpg"; //・・・ imgs[11]="image11.jpg";//11が12月 var date=new Date(); document.getElementById('banner').src=imgs[date.getMonth()]; } </script> </head> <body> <img src="" id="banner"> </body> </html>
お礼
ありがとうございます。 今回教えていただいた方法は月単位ですが、さらに日にちまで考慮することも可能でしょうか？また画像にはそれぞれ違うリンク先へのURLが必要だと言うことをお知らせすることを忘れていました。これらもご教授願います。よろしくお願いいたします。
お礼
本当に丁寧にありがとうございます。 まずはやってみようと思います。 日付までの考慮とは、ご指摘のように○月○日～×月×日の間はこの画像・・・と言うことです。正直言って、画像の表示だけであまり複雑なスクリプトを使うのもどうだろうと思っていますので、現状では教えていただいた方法で何とかしてみようと思います。 またわからないことがありましたら教えてください。ありがとうございました。