ie6经典bug弹出框盖不住select的解决办法

     昨天切页面的时候遇到了传说中的经典————ie6经典bug弹出框盖不住select。以前只是有所耳闻，但是未曾谋面，昨天有幸见到真面目！！

    我昨天试过网上的很多方法，有的说是用iframe把select包住，有的说是把iframe放在弹出层的下面，有的说是把iframe放在弹出层的里面，这些我都试过啦，但是有的效果是实现啦，但是很勉强，因为iframe是盖住select啦，而select也消失的没了。这个让我很郁闷，不知道为什么。。。。今天早上来啦，头脑清醒的解决啦。我就把原来的width：100%,height:100%换成弹出层的具体宽高数值，就好啦，盖住select的同时，select还在。而且给了绝对定位的top和left值，这样iframe就跟弹出框完全重合了，我之前的iframe框是出现在弹出框的下面。而且我也没有按照网上给iframe加z-index值。呵呵，这个iframe上的z-index还是必须要加的，z-index：-1，确保是在弹出层下方，不然添加图片的按钮不能点击。

   

这是ie6下面原来的样子，

这是修改好的

附上关键代码：

 1 <!-- 弹出层-->
 2                         <div class="pop_bg">
 3                             <p class="pop_tip"></p>
 4                             <div class="sign_pop">
 5                                 <dl>
 6                                     <dt>
 7                                         <ul class="tip">
 8                                             <li><a href="#">本地上传</a></li>
 9                                         </ul>
10                                         <a href="#" class="close"><em>&nbsp;</em></a>
11                                     </dt>
12                                     <dd class="add_btn">
13                                         <a href="#"><em>&nbsp;</em>添加图片
14                                             <form action=""><input type="file" class="add_f" size="1"/></form>
15                                         </a>
16                                     </dd>
17                                     <dd class="discrib">支持上传单张5M以下的gif、jpg、png文件</dd>
18                                 </dl>    
19                             </div>
20                             <iframe id="DivShim"  scrolling="no" style="position:absolute;top:0;left:0;width:282px;height:128px;-moz-opacity:0;-webkit-opacity:0; opacity:0; filter:alpha(Opacity=0);background:transparent;"> </iframe> 
21                         </div>
22 <!--这里是select-->
23 <div class="promo_panal">
24                 <div class="head clearfix">
25                     <span class="tit">发微方式</span>
26                 </div>
27                 <div class="body">
28                     <form action="" method="get" class="form_infor">
29                         <div class="form_msg clearfix">
30                             <input name="" type="radio" class="rad" />
31                             <label>立即发送</label>
32                         </div>
33                         <div class="form_msg input clearfix">
34                             <input name="" type="radio" class="rad" />
35                             <label>定时发送：</label>
36                             <input name="" type="text" class="txt" />
37                             <a href="#" class="calendar"><em class="ban ban_4_11">&nbsp;</em></a>
38                             
39                                 <select name="" class="select">
40                                     <option>请选择</option>
41                                 </select>
42                             
43                             <label class="end">时</label>
44                             
45                                 <select name="" class="select">
46                                     <option>请选择</option>
47                                 </select>
48                         
49                             <label class="end">分</label>
50                         </div>
51                     </form>
52                 </div>
53             </div>

转载于:https://www.cnblogs.com/different/archive/2012/07/11/2586007.html