|
在最近的一个项目中，碰着了IE6 select遮挡div的bug，为了办理这个bug我查了许多资料，试图找到一个最最有用的要领，许多人是通过iframe的要领来办理，着实我查了海外的许多资料也是通过iframe的要领来办理的。本日我说说iframe办理的一样平常要领，已经行使jQuery插件bgiframe办理IE6 select z-index无效，遮挡div的bug。
办理要领之一：Iframe包裹select元素
行使iframe包住select，这样iframe有z-index，只要在div上配置的z-index比iframe的高即可~这种要领有必然的范围性，不行能每个select都要加个iframe吧？以是不保举！代码如下：
<iframe style="z-index:1" style="z-index:1"><!-- 用iframe 办理此bug -->
<select name="country">
<option value="1">china</option>
<option value="2">japanese</option>
<option value="1">U.S.A</option>
</select>
</iframe>
办理要领之二：以Iframe作为div的子元素，包围select元素
成立一个跟div同宽同高的iframe，而且z-index比div要低。这种要领保举行使：
<style>.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;
} </style>
<div class="T_div">
<span>这里可以包括其他dom元素</span>
<iframe class="T_iframe"></iframe>
</div>
办理要领之三：行使jQuery的bgiframe插件
假如你的项目引用了jQuery，那么我保举行使bgiframe插件来办理select的遮挡div题目，道理很简朴，就是成立一个同高同宽的iframe插入到div中去~bgiframe下载地点：http://github.com/brandonaaron/bgiframe，行使要领：
$('.fix-z-index').bgiframe();
参数声名：
top：配置top位置，默以为auto
left：配置left位置，默以为auto
width：配置iframe宽度，默以为auto
height：配置iframe高度，默以为auto
opacity：配置是否透明，默以为true
src：配置iframe的src，默以为javascript:false
原文链接：http://www.js8.in/553.html （编辑：河北网）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
|
