プロが教えるわが家の防犯対策術！

複数の画像の中から複数の画像をランダムに表示

締切済

  • 質問者：chiiii
  • 質問日時：
  • 回答数：5件

例えば10個の画像の中から3つの画像をランダムに
重ならないように表示し、かつそれぞれリンク先も設定したいのですが、うまくできません。。

画像のランダムだけならなんとかできたのですが。

いい方法があれば教えてください！

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (5件)

No.1

  • 回答者： mizuno3
  • 回答日時：

0～10の配列を画像とリンク先URLの2種類用意してやって、それをランダムに・・・とかで行ける気がします。



まずは現状のソースとかがあれば説明しやすいかもです♪

参考URLはうさのJavascript講座さんです。

参考URL：http://www.usagi-js.com/sample/sampleen/sample20 …
    • good
    • 0
    • 件
通報する

No.2

  • 回答者： BLUEPIXY
  • 回答日時：

画像が


image.src="imageA.jpg";
の様に設定できるように
link.href="linkA.html";
の様に設定できます。
できたら、現状のソースを補足して下さい。

この回答への補足

mizuno3さんも教えてくださってるページのものを使っています。

<script language="javascript">
<!--//
var arrImage = new Array("img/a_01.jpg",
"img/a_02.jpg",
"img/a_03.jpg",
"img/a_04.jpg")
var arrFlag = new Array(999,999,999);
function Show()
{
document.imgNumber1.src = arrImage[StartRandom(0)];
document.imgNumber2.src = arrImage[StartRandom(1)];
document.imgNumber3.src = arrImage[StartRandom(2)];
}
var nTemp, nLoop;
function StartRandom(nIndex)
{

nLoop = 0;
nTemp = Math.round(Math.random()*(arrImage.length-1));

if (nIndex != 0)
{
for (nLoop = 0; nLoop < nIndex ; nLoop++)
{
if (nTemp == arrFlag[nLoop])
{
StartRandom(nIndex);
}
}
}
arrFlag[nIndex] = nTemp;
return nTemp;
}
function GetNum()
{
return ;
}
//-->
</script>
</HEAD>
<BODY onLoad="Show()">

<IMG name="imgNumber1" src="img/a_01.jpg" width="170" height="170" border="0"> <IMG name="imgNumber2" src="img/a_02.jpg" width="170" height="170" border="0"> <IMG name="imgNumber3" src="img/a_03.jpg" width="170" height="170" border="0">

</BODY>
</HTML>

ここから個々の画像にリンクができないんです。。
教えてください！

補足日時：2005/12/01 10:07
通報する
    • good
    • 0
    • 件
通報する

No.3

  • 回答者： BLUEPIXY
  • 回答日時：

色々と手抜きだけど、とりあえず、これくらいの修正で動くはず


---------------------------------------------------------------
<script language="javascript">
<!--//
var arrImage = new Array(
"img/a_01.jpg",
"img/a_02.jpg",
"img/a_03.jpg",
"img/a_04.jpg");
var arrLink = new Array(
"01.html",
"02.html",
"03.html",
"04.html");

var arrFlag = new Array(999,999,999);
function Show(){
document.imgNumber1.src = arrImage[StartRandom(0)];
document.links[0].href = arrLink[nTemp];
document.imgNumber2.src = arrImage[StartRandom(1)];
document.links[1].href = arrLink[nTemp];
document.imgNumber3.src = arrImage[StartRandom(2)];
document.links[2].href = arrLink[nTemp];
}
var nTemp, nLoop;
function StartRandom(nIndex){

nLoop = 0;
nTemp = Math.round(Math.random()*(arrImage.length-1));

if (nIndex != 0){
for (nLoop = 0; nLoop < nIndex ; nLoop++){
if (nTemp == arrFlag[nLoop]){
StartRandom(nIndex);
}
}
}
arrFlag[nIndex] = nTemp;
return nTemp;
}
//-->
</script>
</HEAD>
<BODY onLoad="Show()">

<a href="01.html"><IMG name="imgNumber1" src="img/a_01.jpg" width="170" height="170" border="0"></a>
<a href="02.html"><IMG name="imgNumber2" src="img/a_02.jpg" width="170" height="170" border="0"></a>
<a href="03.html"><IMG name="imgNumber3" src="img/a_03.jpg" width="170" height="170" border="0"></a>

</BODY>
</HTML>

この回答への補足

すみません。
お礼を言った後で恐縮なのですが、
リンクが動いていませんでした。
<a>タグに入れたものしか反映されないようです。。

何度もすみませんが、教えてください！

補足日時：2005/12/01 12:52
通報する
    • good
    • 0
    • 件
通報する

No.4

  • 回答者： BLUEPIXY
  • 回答日時：

＞<a>タグに入れたものしか反映されないようです。

。
ページ中に他にもリンクタグがあるということですか？
    • good
    • 0
    • 件
通報する

No.5

  • 回答者： BLUEPIXY
  • 回答日時：

＞リンクが動いていませんでした。

<a>タグに入れたものしか反映されないようです。。
例えば、
<a href="01.html" id="link1"><IMG name="imgNumber1" src="img/01.jpg" width="170" height="170" border="0"></a>
<a href="02.html" id="link2"><IMG name="imgNumber2" src="img/02.jpg" width="170" height="170" border="0"></a>
<a href="03.html" id="link3"><IMG name="imgNumber3" src="img/03.jpg" width="170" height="170" border="0"></a>
のようにして、
function Show(){
document.imgNumber1.src = arrImage[StartRandom(0)];
document.getElementById('link1').href = arrLink[nTemp];
document.imgNumber2.src = arrImage[StartRandom(1)];
document.getElementById('link2').href = arrLink[nTemp];
document.imgNumber3.src = arrImage[StartRandom(2)];
document.getElementById('link3').href = arrLink[nTemp];
}
と修正してみて下さい
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報