js实现全屏弹框

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>全屏弹框</title>
    <style type="text/css">
        #DialogsAlert{
            width:505px;
            background-color:#fff;
            text-align:center;
            font-size:14px;
            color:#767676;
            font-family:"microsoft yahei",simsun,Tahoma,sans-serif;
            display: none;
            z-index: 9999;
            position:fixed;
            top:28%;
            left:36%;
        }
        #DialogsAlert h2{
            height:40px;
        }
        .act_pop_title{
            background: #005C91;
            color:#ffffff;
            text-align: left;
            text-indent: 30px;
            line-height: 40px;
            height:40px;
        }
        .Dialogs-Close{
            width:40px;
            height:40px;
            right:-45px;
            top:0;
            position:absolute;
            background-position: -419px 3px;
            z-index: 5;
            background-color: #005c91;
            color: #ffffff;
            font-size: 32px;
            line-height: 32px;
        }
    </style>
</head>
<body style="height:2000px;width:2000px">
<input type="button" value="点击显示弹框或者小区弹框" onclick="DialogS();"/>
<div id="DialogsAlert" class="act_pop">
    <a href="javascript:DialogS()" title="关闭"><span class="Dialogs-Close">X</span></a>
    <h2 class="act_pop_title">全屏弹框哦</h2>
</div>
<script type="text/javascript">
    function DialogS(){
        if(!(document.getElementById("Dialogs"))) {
            var oHead = document.getElementsByTagName("body")[0];
            var oDiv = document.createElement("div");
            oDiv.id = "Dialogs";
            oDiv.style = "height:100%;width:100%;left:0;top:0;background:#ccc;position:fixed;filter:Alpha(opacity=50);opacity:0.5; -moz-opacity:0.5;";
            oHead.appendChild(oDiv);
            document.getElementById("DialogsAlert").style.display = "block";
        }else if(document.getElementById("Dialogs").style.display == "none"){
            document.getElementById("DialogsAlert").style.display = "block";
            document.getElementById("Dialogs").style.display = "block";
        }else{
            document.getElementById("DialogsAlert").style.display = "none";
            document.getElementById("Dialogs").style.display = "none";
        }
    }
</script>
</body>
</html>