IE6 select z

日期:2021-03-13 类型:科技新闻 

关键词:凡科自助建站,企业网站怎么建设,智能建站系统,自己建个网站,搭建网站基本步骤

今日我说说iframe处理的1般方式,早已应用jQuery软件bgiframe处理IE6 select z-index失效,遮挡div的bug。

处理方式之1:Iframe包裹select元素
应用iframe包住select,这样iframe有z-index,要是在div上设定的z-index比iframe的高便可~这类方式有1定的局限性,不能能每一个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>

处理方式之2:以Iframe做为div的子元素,遮盖select元素
创建1个跟div同宽同高的iframe,而且z-index比div要低。这类方式强烈推荐应用:


拷贝编码
编码以下:

<style>.T_iframe
{
position: absolute;/*肯定精准定位确保iframe不容易占有流合理布局室内空间*/
width: 100%; /*100%确保能够遮盖全部div*/
height: 100%;
z-index:⑴; /*⑴确保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>

处理方式之3:应用jQuery的bgiframe软件
假如你的新项目引入了jQuery,那末我强烈推荐应用bgiframe软件来处理select的遮挡div难题,基本原理很简易,便是创建1个同高同宽的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