浮层被 select 穿透,是最常见的 z-index bug。用法:
HTML:
<div class="as-selectmask" style="background:#FF3366;">
内容<br/>
<!--[if lt IE 7]><iframe src="javascript:'';"></iframe><![endif]-->
</div>
CSS:
.as-selectmask {
position: absolute;
left:0;
top:0;
z-index: 10;
overflow: hidden;
width: 33em;
}
.as-selectmask iframe {
position: absolute;
top: 0;
left: 0;
z-index: -1;
border:none;
filter: mask();
width: 3000px; /* for any big value */
height: 3000px /* for any big value */
}
请注意,即使使用这种方法,半透明div下,select 会被彻底隐藏。这个问题还是没办法解决。