复制代码 代码如下:
<html>
<head>
<title>网页特效-窗口特效-弹出窗口后网页背景变暗的效果</title>
<meta http-equiv="content-Type" content="text/html;charset=gb2312">
<!--把下面代码加到<head>与</head>之间-->
<style type="text/css">
.black_overlay{display:none;position:absolute;top:0%;left:0%;width:100%;height:100%;background-color:black;z-index:1001;-moz-opacity:0.8;opacity:.80;filter:alpha(opacity=80);}
.white_content{display:none;position:absolute;top:25%;left:25%;width:50%;height:50%;padding:16px;border:3px solid orange;background-color:white;z-index:1002;overflow:auto;}
</style>
</head>
<body>
<!--把下面代码加到<body>与</body>之间-->
<a href="javascript:void(0)">
点击这里打开窗口</a>
<div>
<a href="javascript:void(0)">
Close</a>
<br>窗口内容
</div>
<div>123</div>
</body>
</html>
例二：
复制代码 代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script language="javascript" type="text/javascript">
function hid()
{
var div4=document.getElementById("div1");
div4.style.display="block";
div4.style.width="200px";
div4.style.height="150px";
div4.style.zIndex="9999";
div4.style.top="43%";
div4.style.left="43%";
div4.style.position="absolute";
var div3=document.getElementById("div2");
div3.style.display="block";
div3.style.width="1000px";
div3.style.zIndex="9998";
div3.style.position="absolute";
div3.style.height=document.body.offsetHeight;
div3.style.top="0px";
div3.style.left="0px";
}
function vis()
{
var div4=document.getElementById("div1");
div4.style.display="none";
var div3=document.getElementById("div2");
div3.style.display="none";
div3.style.width="0px";
div3.style.height="0px";
div4.innerHTML="<a>点击关闭</a><br /><br /><input type='text' /><br /><input type='button' value='button' />";
}
</script>
</head>
<body>
<div>
<table cellpadding="0" cellspacing="0">
<!--DWLayoutTable-->
<tr>
<td> <form runat="server">
<a>点击显示</a><br />
<div>
<a>点击关闭</a><br />
<br />
<asp:TextBox runat="server"></asp:TextBox><br />
<input type="button" value="button" /></div>
<div>
</div>
</form></td>
</tr>
</table>
</div>
</body>
</html>
例三：
复制代码 代码如下: