一个流行的弹出层的效果！

< script > ...
    var docEle = function() ...{
        return document.getElementById(arguments[0]) || false;
    }
    function openNewDiv(_id) ...{
        var m = "mask";
        if (docEle(_id)) document.removeChild(docEle(_id));
        if (docEle(m)) document.removeChild(docEle(m));
        // 新激活图层
        var newDiv = document.createElement("div");
        newDiv.id = _id;
        newDiv.style.position = "absolute";
        newDiv.style.zIndex = "9999";
        newDiv.style.width = "200px";
        newDiv.style.height = "300px";
        newDiv.style.top = "100px";
        newDiv.style.left = (parseInt(document.body.scrollWidth) - 300) / 2 + "px"; // 屏幕居中
        newDiv.style.background = "#EFEFEF";
        newDiv.style.border = "1px solid #860001";
        newDiv.style.padding = "5px";
        newDiv.innerHTML = "新激活图层内容";
        document.body.appendChild(newDiv);
        // mask图层
        var newMask = document.createElement("div");
        newMask.id = m;
        newMask.style.position = "absolute";
        newMask.style.zIndex = "1";
        newMask.style.width = document.body.scrollWidth + "px";
        newMask.style.height = document.body.scrollHeight + "px";
        newMask.style.top = "0px";
        newMask.style.left = "0px";
        newMask.style.background = "#000";
        newMask.style.filter = "alpha(opacity=40)";
        newMask.style.opacity = "0.40";
        document.body.appendChild(newMask);

        // 关闭mask和新图层
        var newA = document.createElement("a");
        newA.href = "#";
        newA.innerHTML = "关闭激活层";
        newA.onclick = function() ...{
            document.body.removeChild(docEle(_id));
            document.body.removeChild(docEle(m));
            return false;
        }
        newDiv.appendChild(newA);
    }
</ script >

< body >
< a  href ="#"  onclick ="openNewDiv('newDiv');return false;" > 激活新层 </ a >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
< p > 网页内容网页内容网页内容 </ p >
</ body >

 op ff ie 都测试通过，包括mask层在三个浏览器上的透明度。

不过还是有些问题：
1、mask层出现后，ctrl+a还是可以全选，显得mask效果不够完善。
2、其次，mask层的计算浏览器的scrollWidth和scrollHeight还是有些问题的。

比如，在一个CSS+DIV的布局中，
<div style="margin: 0px auto">
    <div style="float: left; width: 100px">左边</div>
    <div style="float: reft; width: 100px">右边</div>
</div>
这种模式下的网页，某些浏览器无法通过scrollHeight来获得实际的页面高度，这种bug可以在QQ的那个争论的页面看到，mask没有覆盖全页。

解决办法可通过Dom获取页面实际高度，或者遍历每个float的层的实际高度总和。等等。。。。。