IE6中Select覆盖DIV元素各种解决办法

作者：袖梨 2022-06-25

普通的元素，textbox, div, table……这些，属于windowless element，它们之间互相遮盖的情况由z-index决定，在它们之上，是SELECT这些windowed element。所以一般情况下div、table等不能遮盖select。


解决办法一：Iframe包裹select元素

 代码如下 复制代码

<iframe style="z-index:1" style="z-index:1">


解决办法二：以Iframe作为div的子元素，覆盖select元素

 代码如下 复制代码

.T_iframe
{
position: absolute;/*绝对定位保证iframe不会占用流布局空间*/
width: 100%; /*100%保证可以覆盖整个div*/
height: 100%;
z-index:-1; /*-1保证iframe显示在div下方*/
}
.T_div
{
position: absolute;
left:100px;
top:50px;
width: 300px;
height: 200px;
background : blue;
z-index:100;
}


这里可以包含其他dom元素

解决办法三

 代码如下 复制代码

示例程序代码：
//html.select.hack.iframe shim.htm


 


 


 
 

    id=”PopupDiv”
  style=”position:absolute;font:italic normal bolder 12pt Arial; top:25px; left:50px; padding:4px; display:none; color:#ffff00; z-index:100″>
  …. and a DIV can cover it up
through the help of an IFRAME.
 
    id=”DivShim”
  src=”javascript:false;”
  scrolling=”no”
  frameborder=”0″
  style=”position:absolute; top:0px; left:0px; display:none;filter=progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0);”>
 
 

 

  Click to show DIV.
 

 

  Click to hide DIV.

相关文章

精彩推荐