0

JavaScript 関数によって生成された div タグ内に画像を配置しようとしています。問題は、画像の位置が左から 75 ピクセル、上から 40 ピクセルではなく、0,0 に固定されていることです。コードはこちら。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<HTML lang="en">
<HEAD>  
<META http-equiv="Content-Type" content="text/html">    
</HEAD> 
<SCRIPT language = "JavaScript">
var my_div = null;
var newDiv = null; 
function creatediv(id, width, height, left, top, opacity) 
{ 
    var newdiv = document.createElement('div'); 
    newdiv.setAttribute('id', id);  

    newdiv.style.width =  width + "px";     
    newdiv.style.height = height + "px";     

    newdiv.style.position = "absolute";         
    newdiv.style.left = left + "px";         
    newdiv.style.top = top + "px";  

    newdiv.style.opacity = opacity;

    document.body.appendChild(newdiv); 

    my_div = document.getElementById(id);
    document.body.insertBefore(newdiv, my_div);
}
</SCRIPT>
<BODY onload="  creatediv('logo', 792, 1000, 75, 40, 1)">
<div  id = "logo" style=" z-index:1; font-size:200%; ">         
        <img src="some.gif" width="10%" height="10%">           
</div>
</BODY>
</html>
4

2 に答える 2

1

これを試してください:ライブデモ

function updateDiv(id, width, height, left, top, opacity) 
{ 
    var mydiv = document.getElementById(id);
    mydiv.setAttribute('id', id);  

    mydiv.style.width =  width + "px";     
    mydiv.style.height = height + "px";     

    mydiv.style.position = "absolute"; 
    mydiv.style.left = left + "px";         
    mydiv.style.top = top + "px";  

    mydiv.style.opacity = opacity;
}

出力

<body onload="  updateDiv('logo', 792, 1000, 75, 40, 1)">
<div id="logo" style="z-index: 1; font-size: 200%; width: 792px; height: 1000px; position: absolute; left: 75px; top: 40px; opacity: 1;">         
        <img src="1.jpg" width="10%" height="10%">           
</div>  
</body>

アップデート

画像ファイルを引数として渡す必要がある場合:

HTML

<BODY onload="  updateDiv('logo', 792, 1000, 75, 40, 1, '1.jpg')">
    <div  id = "logo" style=" z-index:1; font-size:200%; "></div>
</BODY>

Javascript

function updateDiv(id, width, height, left, top, opacity, imgSrc) 
{ 
    var mydiv = document.getElementById(id);
    mydiv.setAttribute('id', id);  

    mydiv.style.width =  width + "px";     
    mydiv.style.height = height + "px";     

    mydiv.style.position = "absolute"; 
    mydiv.style.left = left + "px";         
    mydiv.style.top = top + "px";  

    mydiv.style.opacity = opacity;

    mydiv.innerHTML = '<img src="' + imgSrc + '" width="10%" height="10%">';
}
于 2013-02-24T07:39:22.863 に答える
1

画像をjavascriptによって生成されたdiv内に配置したい場合は、次のコードを使用できます。

function creatediv(id, width, height, left, top, opacity, imageurl) 
{ 
    var newdiv = document.createElement('div'); 
    newdiv.setAttribute('id', id);  

    newdiv.style.width =  width + "px";     
    newdiv.style.height = height + "px";     

    newdiv.style.position = "absolute";         
    newdiv.style.left = left + "px";         
    newdiv.style.top = top + "px";  

    newdiv.style.opacity = opacity;

    newdiv.innerHTML='<img src="' + imageurl + '" width="10%" height="10%">';

    document.body.appendChild(newdiv); 

    my_div = document.getElementById(id);
    document.body.insertBefore(newdiv, my_div);
}
于 2013-02-24T07:41:11.440 に答える