- ベストアンサー
ランダム画像 & マウスオーバー画像切り替え
- JavaScriptを使用してランダムに画像を切り替える方法と、マウスオーバー時に画像を変更する方法について質問があります。
- さらに、画像のそれぞれに個別のリンクを付け加え、それをインラインフレーム内で表示したいです。
- どなたかご教授いただけると幸いです。
- みんなの回答 (5)
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
<script> var img = 'gazou1.jpg gazou2.jpg gazou3.jpg gazou4.jpg gazou5.jpg gazou6.jpg'.split(' '); //for(var i=0,img=[];i<6;i++) img[i]='gazou'+(i-0+1)+'.jpg';//これでもいいかも? var url = 'url1.jpg url2.jpg url3.jpg'.split(' '); var n = Math.floor(Math.random()*3); document.write('<a href="'+url[n]+'" target="_top">'); document.write('<img src="'+img[n]+'" border="0" onMouseOver="this.src=\''+img[n-0+3]+'\'" onMouseOut="this.src=\''+img[n]+'\'">'); document.write('</a>'); </script>
その他の回答 (4)
さらに勘違い! target="_top" は意味が無いね;_; ごめん!もう時間が無くてしばらく答えられません! <a>タグで挟めばよろしいかと・・・
間違えた! var url = 'url1.html url2.html url3.html'.split(' '); 半角空白文字で区切ってURLを配列に格納します
<html> <body> <script> img = new Array(); img[0] = "gazou1.jpg"; img[1] = "gazou2.jpg"; img[2] = "gazou3.jpg"; img[3] = "gazou4.jpg"; img[4] = "gazou5.jpg"; img[5] = "gazou6.jpg"; var url = 'url1.jpg url2.jpg url3.jpg'.split(' '); var n = Math.floor(Math.random()*3); document.write('<img src="'+img[n]+'" border="0" target="_top" onMouseOver="this.src=\''+img[n-0+3]+'\'" onMouseOut="this.src=\''+img[n]+'\'" onClick="location.href=\''+url[n]+'\'">'); </script>
<html> <body> <img src="gazou4.jpg" target="_top" onMouseOver="this.src=this.src.replace(/\d/,Math.floor(Math.random()*3)-0+4);" onMouseOut="this.src=this.src.replace(/\d/,this.src.replace(/\D/g,'')-3)"> 最初の画像が4番で固定です ファイル指定のディレクトリの中に数字があると使えません
お礼
どうもご丁寧に訂正までありがとうございます。 本当に感謝です(涙) 今から試してみたいと思います! target="_top"の値を<a>タグで挟むっていうのは どこに記述すればいいのか、お時間がある時でいいので ご教授頂けるとありがたいです。すいません勉強不足で;; どうかよろしくおねがいいたします。