<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head><body>
<table>
<tr>
<td><input type="button" value="点击我显示div1的内容" /></td>
<td>a</td>
<td>b</td>
<td><input type="button" value="点击我显示div2的内容" /></td>
</tr>
</table></body>
</html>
我是想弹出一个div层,还能指定层的位置,层里有 <table> 

解决方案 »

  1.   

    可以,先隐藏这个层,再根据你想要的位置显示就可以了,假设这个层的id为test 
    那么你要的位置document.getElementById("test").style.left = xx+"px";
    document.getElementById("test").style.marginLeft = xx+"px";top的控制是一样的,当点击的时候显示就可以了,楼主应该理解了吧,已经很明确了
      

  2.   


    table,tr,td{border:1px solid #ccc; border-collapse:collapse;}
    table.parent{width:500px; position:relative;}
    td{height:22px;line-height:22px;}
    #div1,#div2{width:300px;height:200px;display:none;background:#c0c0c0;border:5px solid #f7f7f7; position:absolute;}
    #div1{left:20px; top:10px;}/*1位置*/
    #div2{left:50px; top:50px;}/*2位置*/
    td div table{width:300px;}
    function ctrlDIV(id) {
            var div = document.getElementById(id);
            if (div.style.display == "block") {
                div.style.display = "none";
            } else {
                div.style.display = "block"
            }
        }
    <table class="parent">
    <tr>
    <td><input type="button" value="点击我显示div1的内容" onclick="ctrlDIV('div1')" /></td>
    <td><div id="div1" onclick="ctrlDIV('div1')"><table><tr><td>点击关闭</td></tr></table></div></td>
    <td><div id="div2" onclick="ctrlDIV('div2')"><table><tr><td>点击关闭</td></tr></table></div></td>
    <td><input type="button" value="点击我显示div2的内容" onclick="ctrlDIV('div2')" /></td>
    </tr>
    </table>
      

  3.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <script type="text/javascript">
    function  show(id,l,t){
        
        var div=document.getElementById(id);
        div.style.width="50px";
        div.style.height="50px";
        div.style.border="1px solid black";
        div.style.position="absolute";
        div.style.display="block";
        div.style.left=parseInt(0|document.getElementById(l).value)+"px";
        div.style.top =parseInt(0|document.getElementById(t).value)+"px";
    }
    </script>
    </head><body>
    <table>
    <tr>
    <td><input type="button" value="点击我显示div1的内容" onclick="show('div1', 'l1', 't1');"/><br>left:<input id="l1" /><br>top :<input id="t1" /></td>
    <td>a</td>
    <td>b</td>
    <td><input type="button" value="点击我显示div2的内容" onclick="show('div2', 'l2', 't2');" /><br>left:<input id="l2" /><br>top :<input id="t2" /></td>
    </tr>
    </table>
    <div id="div1" style="display:none;">div1</div><div id="div2" style="display:none;">div2</div>
    </body>
    </html>
      

  4.   

    http://topic.csdn.net/u/20100223/17/edb27cb3-24ff-461d-9cff-eb8b8816b6bf.html?48805