你的位置:首页 > 软件开发 > 网页设计 > 遮罩的几种写法

遮罩的几种写法

发布时间:2015-12-09 11:00:36
遮罩一: 1 <!DOCTYPE > 2 <html > 3 <head> 4 <title>DIV CSS遮罩层</title> 5 <script language="javascrip ...

遮罩一:

 

遮罩的几种写法遮罩的几种写法
 1 <!DOCTYPE > 2 <html > 3 <head> 4   <title>DIV CSS遮罩层</title> 5   <script language="javascript" type="text/javascript"> 6 function showdiv() { 7       document.getElementById("bg").style.display ="block"; 8       document.getElementById("show").style.display ="block"; 9     }10 function hidediv() {11       document.getElementById("bg").style.display ='none';12       document.getElementById("show").style.display ='none';13     }14   </script>15   <style type="text/css">16     #bg {17       display: none;18       position: absolute;19       top: 0%;20       left: 0%;21       width: 100%;22       height: 100%;23       background-color: black;24       z-index: 1001;25       -moz-opacity: 0.7;26       opacity: .70;27       filter: alpha(opacity=70);28     }29 30     #show {31       display: none;32       position: absolute;33       top: 25%;34       left: 22%;35       width: 53%;36       height: 49%;37       padding: 8px;38       border: 8px solid #E8E9F7;39       background-color: white;40       z-index: 1002;41       overflow: auto;42     }43   </style>44 </head>45 <body>46   <input id="btnshow" type="button" value="打开" onclick="showdiv();" />47   <div id="bg"></div>48   <div id="show">49     内容测试50     <input id="btnclose" type="button" value="关闭" onclick="hidediv();" />51   </div>52 </body>53 </html>

原标题:遮罩的几种写法

关键词:

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

可能感兴趣文章

我的浏览记录