<!doctypehtml>
<head>
<metacharset="utf-8"/>
<title></title>
<styletype="text/css">
*{}{margin:0;padding:0;}
html{}{_background:url(about:blank);}/**//*阻止闪动inIE6,把空文件换成about:blank,减少请求*/
body{}{background:#fff;font:12px/1.5Tahoma,Geneva,\\5b8b\\4f53,sans-serif;height:100%;}
.wrap{}{height:980px;padding-top:20px;text-align:center;}
p{}{font-size:14px;text-align:center;line-height:24px;}
/**//**遮罩层**/
#masklayer{}{
background:#000;
display:none;
filter:alpha(opacity=50);
opacity:0.5;
top:0;
left:0;
height:100%;
width:100%;
z-index:999;
position:fixed;
_position:absolute;
_left:expression(documentElement.scrollLeft+documentElement.clientWidth-this.offsetWidth);
_top:expression(documentElement.scrollTop+documentElement.clientHeight-this.offsetHeight);
}
/**//**弹出层**/
#popup{}{
display:none;
width:300px;
z-index:1000;
left:50%;
top:50%;
position:fixed!important;
margin-left:-150px!important;
_position:absolute;
_top:expression(eval(document.compatMode&&document.compatMode=='CSS1Compat')?
documentElement.scrollTop+(document.documentElement.clientHeight-this.offsetHeight)/2:/**//*IE6*/
document.body.scrollTop+(document.body.clientHeight-this.clientHeight)/2);/**//*IE5IE5.5*/
}
.content{}{background:#f3f3f3;border:1pxsolid#999;}
.contenth3{}{background:#a0a0a0;color:#fff;font-size:14px;height:32px;line-height:32px;padding-left:5px;}
#clickbtn{}{margin-top:20px;}
</style>
</head>
<body>
<divclass="wrap">
<p>
我是正文我是正文我是正文我是正文我是正文我是正文我是正文
<br/>
我是正文我是正文我是正文我是正文我是正文我是正文我是正文
<br/>
我是正文我是正文我是正文我是正文我是正文我是正文我是正文
<br/>
我是正文我是正文我是正文我是正文我是正文我是正文我是正文
<br/>
我是正文我是正文我是正文我是正文我是正文我是正文我是正文
</p>
<inputtype="button"id="clickbtn"value="clikeme"/>
</div>
<divid="masklayer"></div>
<divid="popup">
<divclass="content">
<h3>我是弹出层有没有居中？</h3>
<p>居中居中居中居中居中居中</p>
<p>居中居中居中居中居中</p>
<p>居中居中居中居中</p>
<p>居中居中居中</p>
</div>
</div>
<scripttype="text/javascript">
(function(masklayer){
varclickbtn=document.getElementById('clickbtn');
clickbtn.onclick=function(){
varpopup=document.getElementById('popup');
masklayer.style.display='block';
popup.style.display='block';
varh=popup.clientHeight;
with(popup.style){
marginTop=-h/2+'px';
}
}
})(document.getElementById('masklayer'))
</script>
</body>
</html>
|
运行时间载入中.....