关于创建遮罩层的问题求助

IE6ps1, FF2 测试结果一致，没问题呀！
<!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>
    <title> new document </title>
    <meta name="generator" content="editplus" />
    <meta name="author" content="Gao YiXiang" />
    <meta name="email" content="[email protected]" />
    <meta name="keywords" content="javascript dhtml dom" />
    <meta name="description" content="I love web development." />
    <style type="text/css">
body
{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
.test
{
    width: 100px;
    height: 100px;
    background-color: yellow;
    border: 1px solid red;
}
    </style>
</head>
<body>
    <input type="button" id="btnClick" value="Click" />
    <div id="divTest" class="test"></div>
    <script type="text/javascript">
    <!--
var o = document.getElementById("divTest");
alert(o.offsetTop); // 22
alert(o.offsetLeft); // 0
    //-->
    </script>
</body>
</html>

解决方案 »

  1.   

    我试了下,是可以的,但我想问下如果一个div欠在好几个div里面,我要获取这个div相对于window的位置怎么做,谢谢
      

  2.   

    没问题滴!div遮罩层，IE6sp1, FF2 测试可用！L@_@K
    <!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>
        <title>dhtml.div.maskLayer.html</title>
        <meta name="generator" content="editplus" />
        <meta name="author" content="Gao YiXiang" />
        <meta name="email" content="[email protected]" />
        <meta name="keywords" content="javascript dhtml dom" />
        <meta name="description" content="I love web development." />
        <style type="text/css">
    body
    {
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        font-size: 12px;
    }
    .test
    {
        width: 100px;
        height: 100px;
        background-color: yellow;
        border: 1px solid red;
    }
    h3
    {
        margin-top: 10px;
        margin-left: 10px;
    }
    #divContainer
    {
        padding: 15px 15px 15px 15px;
        background-color: black;
        border: 1px solid red;
        text-align: center;
    }
        </style>
    </head>
    <body>
        <h3>div遮罩层，IE6sp1, FF2 测试可用！</h3>
        <input type="button" id="btnMask" value="Mask" />    <div id="divContainer">
            <div id="divTest" class="test">
                姓名 <input type="text" id="" style="width: 60px" /><br />
                年龄 <input type="text" id="" style="width: 60px" />
            </div>        
        </div>    <script type="text/javascript">
        <!--
    function $(sId)
    {
        return document.getElementById(sId);
    }$("btnMask").onclick = function()
    {
        var d = $("divTest");    var mask = document.createElement("div");
        document.body.appendChild(mask);
        with (mask.style)
        {
            position = "absolute";
            zIndex = 101;
            top = d.offsetTop + "px";
            left = d.offsetLeft + "px";
            width = d.offsetWidth + "px";
            height = d.offsetHeight + "px";
            backgroundColor = "#d6d3ce";
            border = "1px dotted black";
            // for IE.
            filter = "alpha(opacity=50)";
            // for FF.
            opacity = "0.5";        
        }
    };    //-->
        </script>
    </body>
    </html>
      

  3.   

    楼上的方法不行啊,我这样实现的
     var thetop=0; 
        var theleft=0;
        var theobj = $get('showdetail');
        while(theobj!=null)
        {
        thetop += theobj.offsetTop;
        theleft+= theobj.offsetLeft;
         theobj = theobj.parentElement;
         
        }
        aaa.style.top=thetop;
    aaa.style.left=theleft;
    aaa.style.width=showdetail.clientWidth;
    aaa.style.height=showdetail.clientHeight;
      

  4.   

    function getposOffset(what, offsettype) {
    var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
    var parentEl=what.offsetParent;
    while (parentEl!=null){
    totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
    parentEl=parentEl.offsetParent;
    }
    return totaloffset;
    }应该能用