- 締切済み
ランダム表示の画像とリンクのづれを修正したい
以前こちらで下記のようなjavascriptのリンク付画像のランダム表示方法を教えて頂きました。 画像は全部で20枚以上、表示枚数は8枚、総画像枚数分別々のリンク先を指定します。画像枚数分のhtmlページが存在し、全てのページにテンプレートで同じスクリプトが組み込んであり、それぞれのページに8枚の違う画像が表示され、そこから好きな画像をクリックすることで指定したリンクページにジャンプさせたいのです。 が…確認すると画像は8枚づつランダムに表示はされるのですが、画像とその画像に指定したリンクがづれる箇所があります。全部ではないのですが…どこで画像とリンクがづれているのかいつも決まっているわけでもなく全くわかりません。 Images.splice(k,1);のところだと思いイジってみたものの今度は画像の表示8枚の中で、同じ画像が 表示されてしまったりと、解決できませんでした。 どのように直せば画像をランダムに表示させてリンク先のづれを無くせるのか、よろしければどなたか教えて頂けると大変光栄です。 <head> <script type="text/javascript"> var imgcount=23; var viewcount=8; var Images = new Array(); var Link = new Array(); Link[0]="o00.htm"; Link[1]="o01.htm"; Link[2]="o02.htm"; ・・・・・・ Images[0] = './img/0.jpg'; Images[1] = './img/01.jpg'; Images[2] = './img/02.jpg'; ・・・・・・ function changeImage(){ for(i=0;i<viewcount;i++){ k = parseInt(Math.random() * Images.length); document.getElementById("a_"+i).innerHTML='<a href="'+Link[k]+'" target="_self"> <img src="'+Images[k]+'"></a>'; Images.splice(k,1); } } </script> </head> <body onload="changeImage()"> <table> <tr><td id="a_0"></td><td id="a_1"></td><td id="a_2"></td><td id="a_3"></td></tr> <tr><td id="a_4"></td><td id="a_5"></td><td id="a_6"></td><td id="a_7"></td></tr> </table> よろしくお願いいたします。
- pfam
- お礼率87% (7/8)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- nine999
- ベストアンサー率44% (512/1140)
Images.splice(k,1); これが何をしているのか判りませんが、その前までは同じｋを使っているので同じ値が画像とリンクで使われています。 もしかしたら、Images.splice(k,1);の中で画像を置き換えたりしているのかも知れません。 提示のスクリプトだけでみると、Images.splice(k,1);を取り外すと問題なく画像とリンクが正しく表示されるように見受けられます。
お礼
私の説明がわかりにくかったですね。 一度Images.splice(k,1);は取り外してみましたが、リンクは問題ないかったと思いますが、 表示がランダムになっていない？のかランダムになってるけど画像が重複してしまいます。 表示されるのは8枚、すなわち更新するたび8枚の画像＝8種類の画像が表示されるのが Images.splice(k,1);を取り除くと８枚の表示枠に5種類の画像といように重複されてしまいます。 他のスクリプトに置き換える方がいいのでしょうか？