日期:2014-05-16  浏览次数:20372 次

锁定页面
在CSDN上有一个效果是一个框中的可用旁边的所有都被锁定
那个效果怎么实现?

------解决方案--------------------
自己建个页面运行一下,这就是你要的效果

<html>
<head>
</head>
<body>
<p align= "center ">
<script>
function locking(){
document.all.ly.style.display= "block ";
document.all.ly.style.width=document.body.clientWidth;
document.all.ly.style.height=document.body.clientHeight;
document.all.Layer2.style.display= 'block ';
}
function Lock_CheckForm(theForm){
if(theForm.P_USERPASS.value== ' '){alert( "错误:请输入你的用户密码! ");theForm.P_USERPASS.focus();return false;}
if(theForm.P_USERPASS.value != '123 '){alert( "错误:密码错误! ");theForm.P_USERPASS.value= ' ';theForm.P_USERPASS.focus();return false;}
else{document.all.ly.style.display= 'none ';document.all.Layer2.style.display= 'none ';}
return false;
}
</script>
<img src= "http://gg.blueidea.com/2006/chinaok/468x60.gif ">

</p>
<p align= "center ">

<INPUT TYPE= "button " value= "系统锁定 " onclick= "locking() ">
</p>
<div id= "ly " style= "position:absolute;top:0px;FILTER: alpha(opacity=60);background-color:#777; z-index:2; left: 0px;display:none; "> </div>

<!-- 浮层框架开始 -->
<div id= "Layer2 " align= "center " style= "position:absolute; z-index:3; width: 540; height:170px;left:expression((document.body.offsetWidth-540)/2); top: expression((document.body.offsetHeight-170)/2);background-color:#fff;display:none; " valign= "center ">
<form method= "POST " action= " " onsubmit= "return Lock_CheckForm(this); ">
<TABLE width=540 height=170 border=0 cellpadding=0 cellspacing=0 style= "border:0 solid #e7e3e7;border-collapse: collapse ">
<TR>
<TD style= "background-color:#73A2d6;color:#fff;padding-left:4px;padding-top:2px;font-weight:bold;font-size:14px; " height=27 valign= "center "> [&nbsp;警&nbsp;告&nbsp;] </TD>
</TR>
<TR>
<TD align= "center " valign= "center "> 请输入解除锁定密码 <p> <input type= "text " name= "P_USERPASS " size= "20 "> </TD>
</TR>
<TR>
<TD height=30 align= "center "> <INPUT type= "submit " value= " 确 定 "> </TD>
</TR>
</TABLE>
</form>
</div>
<!-- 浮层框架结束 -->
</body>
</html>