最简单的Div+ CSS弹出层效果

<html>
<head>

<title>简单的Div+ CSS弹出层效果</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<script language="javascript">
function ShowDiv(s)
    {
        if(s>0)
        {
            document.getElementById('ceng').style.display='block';
            document.getElementById('close').style.display='block';
        }else{
            document.getElementById('ceng').style.display='none';
            document.getElementById('close').style.display='none';
        }
    }
</script>
</head>

<body>

<a href="#" onclick="ShowDiv(1)">点击弹出</a>

<div id="ceng" style="position:absolute;z-index:2;left:0;top:0;right:0;background-color:#000;filter:alpha(opacity=50);margin:1px 1px;display:none;100%;height:100%;text-align:center;"> 
</div>

<div id="close" style="position:absolute !important;left:30%;top:0px;z-index:3;border:1px solid #ff6600;background-color:#fff;margin:100px auto;padding:0px;display:none;400px;height:300px;text-align:right">
<a href="#" onclick="ShowDiv(0)">关闭</a>

<div style="text-align:center;"><br>内容
<br> 哇哈哈哈</div>
</div>

</body>
</html>

　　效果如下:

欢迎加入JAVA技术交流QQ群：179945282

欢迎加入ASP.NET(C#)交流QQ群：17534377