打开窗口弹出页面

时间：2021-01-28 17:43:19
<!doctype html>
<html class="no-js" lang="">
<head>
    <script>
        $(document).ready(function(){
            showBg();
        });
    </script>
    <script type="text/javascript">

        //显示灰色 jQuery 遮罩层
        function showBg() {
            var bh = $("body").height();
            var bw = $("body").width();
            $("#fullbg").css({
                height:bh,
                width:bw,
                display:"block"
            });
            $("#dialog").show();
        }
        //关闭灰色 jQuery 遮罩
        function closeBg() {
            $("#fullbg,#dialog").hide();
        }
    </script>
<style>
#main{height:1800px;padding-top:90px;text-align:center}
#fullbg{z-index:100;filter:alpha(opacity=80);-moz-opacity:.5;-khtml-opacity:.5;position:fixed;left:0;right:0;top:0;bottom:0;background-color:#000;opacity:.7}
#dialog{height:400px;left:50%;margin:-200px 0 0 -300px;padding:1px;position:fixed!important;position:absolute;top:50%;z-index:110;border-radius:5px;display:none}
#dialog p{margin-top:-390px;height:24px;line-height:24px;z-index:200}
#dialog img{border-radius:10px}
#dialog p.close{text-align:right;padding-right:10px}
#dialog p.close a{color:#fff;background:#383838;padding:2px 10px;border-radius:2px;text-decoration:none}

</style>
</head>

<body style="min-height:2000px" class="root61">
<div id="fullbg"></div>
<div id="dialog">
    <img src="img/tongzhi.png" />
    <p class="close"><a href="#" onclick="closeBg();">关闭</a></p>
</div>
</body>
</html>

标签：

相关文章