2
ハードコードされた "<div>"と "<img>"タグを使用して、同じサイズの背景イメージ（map.png）上にほとんど透明なイメージ（t01.png）をオーバーレイするhtml/javascriptドキュメントを作成しました。javascriptの動的イメージプレースメントがハードコードされたバージョンのように機能しないのはなぜですか？
ハードコードされたタグの代わりにjavascriptのcreateElementコマンドを使用して結果を複製したいが、表示されるページには、必要に応じてオーバーレイさせるのではなく、 。
動的イメージプレースメントをハードコードされたバージョンと同じにするには、何を変更する必要がありますか？
ハードコードされたバージョン：
<html>
<head>
<script LANGUAGE="JavaScript" type="text/javascript">
var iImage = 0;
var imageFiles = ["./map.png","./t01.png"]
var numImages = 2;
function imageLoad() {
for(iImage = 0; iImage < numImages; iImage++) {
document.images[iImage].src = imageFiles[iImage];
}
}
</script>
</head>
<body onLoad="imageLoad();">
<div id="imageBox" STYLE="position: absolute; top:0px; height: 1px;">
<div ID="frame0" STYLE="position: absolute; top: 0em; left: 0em;">
<img src="./map.png" border="1">
</div>
<div ID="frame1" STYLE="position: absolute;top: 0em; left: 0em;">
<img src="./t01.png" border="1">
</div>
</div>
</body>
</html>
ダイナミック配置バージョン
<html>
<head>
<script LANGUAGE="JavaScript" type="text/javascript">
var iImage = 0;
var imageFiles = ["./map.png","./t01.png"]
var numImages = 2;
function imageLoad() {
placeImage();
for(iImage = 0; iImage < numImages; iImage++) {
document.images[iImage].src = imageFiles[iImage];
}
}
function placeImage()
{
for(iImage = 0; iImage < numImages; iImage++) {
// Create div for this image.
var thisDiv = document.createElement("div");
var thisDivID = "frame" + iImage;
thisDiv.id = thisDivID;
thisDiv.position = "absolute";
// Create image.
var thisImage = document.createElement("img");
thisImage.src=imageFiles[iImage];
// Add this image to this div.
thisDiv.appendChild(thisImage);
// Add this div to the imageBox div.
document.getElementById("imageBox").appendChild(thisDiv);
}
}
</script>
</head>
<body onLoad="imageLoad();">
<div id="imageBox" STYLE="position: absolute; top:0px; height: 1px;"></div>
</body>
</html>
ハードコーディングされたバージョンは、 'frame0'の 'top'と 'left'と '0em'に 'frame1'を設定しているようです。私は動的版では 'thisDiv'に起こっていることは分かりません。 – polarysekt
良いキャッチですが、これらの属性を動的バージョンに追加しても差はありません。 – Kevin
'thisDiv.style [position/top/left]'を使用しましたか？私はあなたが既にimageBoxをインライン化しているという答えを提供することを意図していましたが、コード内でそれをやりたいのであれば、一度しか必要ないでしょう。 – polarysekt