被 select
穿透,是最常见的 z-index
bug。用法:
- HTML:
<div id="dd3" class="sl-select-free" style="background:#FF3366;"> 内容<br/> <!--[if lte IE 6.5]><iframe src="javascript:'';"></iframe><![endif]--> </div>
- CSS:
.sl-selectmask { position: absolute; left:0; top:0; z-index: 10; overflow: hidden; width: 33em; } .sl-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
会被彻底隐藏。这个问题还是没办法解决。