JS遮罩层——如何使被遮罩后的链接可以点击

在遮罩层的使用过程中,发现了一个问题,如果有一个有<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>