画像をランダムな座標に一定の時間で表示する方法

解決済

質問者：tenikiti03
質問日時：2006/07/06 20:41
回答数：2件

javascript勉強中の65歳の初心者です
画像を乱数で得た座標に一定の時間で表示したいと次の通り試行錯誤していますが、どうも最初の1個は表示されますが配列の2番目以降表示されません。
初歩的な質問で恐縮ですがご指導お願いします。
<html>
<head>
<title>テスト表示</title>
</head>
<body onload= "set()">

<script language="JavaScript"><!--
sx = new Array();
sy = new Array();
num = 20;
var timer;
var n;
var i;
var m;
n = 0;

function set(){

for (m=0; m<num; m++) {
sx[m] = Math.floor(Math.random()*800);
sy[m] = Math.floor(Math.random()*600);

}

setInterval("uncohyouji()", 2000);

}

function uncohyouji(){

styl = "<img src='unco1.gif'style='position:absolute;";

document.write(styl+sx[n]+"px;left:"+sy[n]+"px;' name='unco1"+n+"'>");

n++;

}

通報する

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

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： nipox
回答日時：2006/07/08 00:16

ソースを落として実験したら原因が分かりました。

uncohyouji()
で、document.write()
してますよね。

これは、ドキュメントを真っ白にして書き込むという命令なので、
真っ白にした瞬間に、スクリプトも消えてしまうわけです。

その証拠に、
uncohyouji()内で、
write()したあとに、
alert();
を書いて実行すると、
1回しか表示されません。

よって、writeは、使ってはいけないことになります。

回避策は2つあります。
ひとつは、
<img>に、id="img"という属性を書き、
document.getElementById('img').style.left=sy[n]+'px';
document.getElementById('img').style.top=sx[n]+'px';

とやるか、

document.body.innerHTML="<img src.....
とやるかのどちらかです。

参考URL：http://n.chu.in/1/click.html