js 弹出全屏窗效果

下面分别是css代码，div代码和js代码，多动手，进步就大，下面的代码需要自己分别把代码复制到你的代码中，可以先放到一个html文件中看下效果，哪果可以用的话可以复制过去，如果有些出入的话，可以修改下再复制过去，

如果不合适的话就报歉了，不过可以了解下原理，其中主要用到的是

       var width=document.documentElement.clientWidth;
        var height=document.documentElement.clientHeight ;

这两项，他们是获取可见屏幕的宽度和高度，用他们减去你设置的div的宽度和高度，再除以2就可以得到你的div离屏幕左边和上边的距离。

另外就是css晨面的postion属性的应用了，其中用到了fixed值。

具体的需求具体的用法了。

css代码，样式可以自己设置，

<style>
#TopTipHolder{height:0;overflow:hidden;position:relative;width:100%;}
#TopTip{height:360px;line-height:360px;text-align:center;background:#FFFFFF;width:1020px; margin:0 auto;}
.allping{ width:100%; height:100%; background-color:#000;filter:alpha(opacity=90);-moz-opacity:0.9;opacity:0.9;position:fixed;left:0px; top:0px; display:block; z-index:1033;}
.windowswdhg{ width:1060px;height:600px; position:fixed; top:200px;left:50%; background-color:#FFFFF;margin-left:0px; display:block;z-index:1500; cursor:pointer; background-image:url(images/indexnew/registerdbanner.png); background-repeat:no-repeat; background-position:center;}
.windowswdhg img{filter:alpha(opacity=100);-moz-opacity:1;opacity:1;}
.closeyyss{width:50px;height:50px;float:right;}
.bodyshowsyddd{ width:1060px;height:550px; float:right;}
</style>

div代码，可以自己设置，这里是全屏的一个div，背景色为黑色，有透明度为90。

<div class="allping" id="allping">
    <div class="windowswdhg" id="windowswdhg" >
        <div class="closeyyss" id="closeyyss" onclick="closewindows()"></div>
        <div class="bodyshowsyddd" onclick="window.open('http://www.weberlove.com')"></div>
    </div>
</div>

 

js代码，其中可以设置显示时间：

<script type="text/javascript">
        var width=document.documentElement.clientWidth;
        var height=document.documentElement.clientHeight ;
       
       
        var wd=(width-1060)/2;
       
        var hg=(height-600)/2;
        document.getElementById("allping").style.display="block";
        document.getElementById("windowswdhg").style.display="block";
       
        document.getElementById("windowswdhg").style.left=wd+'px';
        document.getElementById("windowswdhg").style.top=hg+'px';
        ///setTimeout(windowhides,20000)//设置显示时间，这里是设置了20秒。
</script>