在遮罩层的使用过程中，发现了一个问题，如果有一个有<a></a>标签链接的HTML页面，如果使用JS遮罩层将此HTML页面遮罩，则此链接无法点击；如果要使此链接可以点击，则需要在<a></a>标签中添加style属性“position:relative;”，例如：
1 <html xmlns="http://www.w3.org/1999/xhtml">
2 <head>
3 <title>DIV CSS遮罩层</title>
4 <script language="javascript" type="text/javascript">
5 function showdiv() {
6 document.getElementById("bg").style.display ="block";
7 //document.getElementById("show").style.display ="block";
8 }
9 function hidediv() {
10 document.getElementById("bg").style.display =‘none‘;
11 document.getElementById("show").style.display =‘none‘;
12 }
13 </script>
14 <style type="text/css">
15 #bg{ display: none; position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; background-
16
17 color: black; z-index:1; -moz-opacity: 0.7; opacity:.70; filter: alpha(opacity=70);}
18 #show{display: none; position: absolute; top: 25%; left: 22%; width: 53%; height: 49%; padding: 8px;
19
20 border: 8px solid #E8E9F7; background-color: white; z-index:1002; overflow: auto;}
21 </style>
22 </head>
23 <body>
24 <input id="btnshow" type="button" value="Show" onclick="showdiv();"/>
25 <!--<div style="z-index:100;position:fixed">-->
26 <a style="z-index:100;position:relative;" href="http://www.baidu.com">百度</a>
27 <!--</div>-->
28 <div id="bg"></div>
29 <div id="show">测试
30 <input id="btnclose" type="button" value="Close" onclick="hidediv();"/>
31 </div>
32 </body>
33 </html>
时间： 2024-08-26 03:14:08