在透明div在上层使下层的链接无法点击的解决
发布时间:2018年4月8日 作者:未知 查看次数:1223
在透明<div>在上层使下层的链接无法点击的解决 一个透明的<div>层在上面(z-index设置),另一个含有链接的<div>层在下面时,链接无法点击。这时可用CSS属性(pointer-events:none;)解决(必须是透明的层遮挡不透明的层,如透明层有图片等内容遮挡则看不见下面的链接,测试是可以点击的)。设置为auto则恢复原属性。 测试代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>在透明div在上层使下层的链接无法点击的解决</title> </head> <body> <div style="position:absolute;pointer-events:none;width:800px;height:600px;z-index:2;"> <div style="position:absolute;pointer-events:auto;left:100px;width:400px;height:300px;background-color:#336633;">子div</div> 透明的div </div> <div style="position:absolute;width:800px;height:600px;background-color:#FF22FF;z-index:1;"> <br><br><br> <a href="http://www.sieye.cn">关注链接下层的链接可以点击</a><br> 另一行 <a href="http://www.sieye.cn">关注链接下层的链接可以点击</a> </div> </body> </html>
|
|
|