首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

Div 兑现弹出层

2012-11-01 
Div 实现弹出层htmlhead??? script?? ? function?? locking(){?? ? document.all.ly.style.display

Div 实现弹出层

<html>
<head>
??? <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){??
? document.all.ly.style.display='none';document.all.Layer2.style.display='none';
? return?? false;??
? }??
??? </script>

</head>
<body>
????
??? <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; left: expression((document.body.offsetWidth-540)/2); top: expression((document.body.offsetHeight-170)/2);
??????? background-color: #fff; display: none;" >
??????? <table width="540" 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="middle">
??????????????????? [&nbsp;警&nbsp;告&nbsp;]?
??????????????? </td>
??????????? </tr>
??????????? <tr>
??????????????? <td height="130" align="center">123456789
??????????????????? <input type="button" value=" 确定 " onclick="Lock_CheckForm(this);">
??????????????? </td>
??????????? </tr>
??????? </table>
??? </div>
?<!-- 弹出层结束 -->
</body>
</html>

热点排行