转自:http://hi.baidu.com/xfwql/blog/item/5b7d96437575951172f05d4d.html
<html><head>
<style type="text/css">
#id1{
width:100%;
background-color:#000;position:absolute;
top:0;left:0;z-index:49;
display:none;
filter:progid:DXImageTransform.Microsoft.Alphaopacity=25;
filter:alpha(opacity=65);
}
#id2{
top:200px;position:absolute;z-index:50;
display:none;
border:3px solid #E5E5E5;
left:100px;
background-color:white;
}
</style>
<script type="text/javascript">
function divShow(){
document.getElementById('id1').style.display='block';
document.getElementById('id2').style.display='block';
document.getElementById('id1').style.height = document.body.clientHeight + document.body.scrollTop;
}
function divHide(){
document.getElementById('id1').style.display='none';
document.getElementById('id2').style.display='none';
}
</script>
</head>
<body>
<div id="id2"> <!--这个是弹出的层-->
<table height='100' width='200'>
<!--第一行-->
<tr><td>
<div id='ShowMSG'></div>
</td></tr>
<!--第一行-->
<tr><td align='center'>
<input onclick="divHide()" type='button' value='关闭'>
</td></tr>
</table>
</div>
<div id="id1"><!--这里是弹出层后的背景 可以不放内容--></div>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<input type="button" onclick="divShow()" value='显示' >
</body></html>
