实现代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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> <link rel="stylesheet" href="StyleSheet.css" type ="text/css" /> </head>
<body> <form id="form1" runat="server">
<script language ="jscript" type ="text/javascript">
function ShowLogin() { var ele=document.getElementById("loginForm"); var block=document.getElementById("block"); ele.style.display=""; block.style.display=""; }
function Reset() { document.getElementById("loginForm").style.display="none"; document.getElementById("block").style.display="none";
}
// window.onload=Reset();
</script>
<div id="loginForm"> <table> <tr> <td> </td> <td> <input type="hidden" value="Login" name="Login" /> </td> </tr> <tr> <td> 用户名: </td> <td> <input name="userName" /> </td> </tr> <tr> <td> 密码: </td> <td> <input id="password" name="password" /> </td> </tr> <tr> <td> <input type="submit" value="登陆" /> </td> <td> <input type="reset" value="取消" onclick="Reset()" /> </td> </tr> </table> </div> <div id="block"> </div> </form> </body> </html>
/*登陆Form*/ #loginForm { border:solid 1px #AED5FD; position:absolute; top:35%; left:40%; z-index:2000; background-color:#EAF4FE; } /**//*屏蔽Div*/ #block { background-color:#CCCCCC; position:absolute; top:0px; left:0px; z-index:1000; display:block; width:100%; height:210%; /**//*设置屏蔽div的透明度*/ filter : progid:DXImageTransform.Microsoft.Alpha ( enabled=true , style=0 , opacity=40); }
|