IE6下Select元素被div等元素遮盖的处理方法

日期:2021-01-20 类型:科技新闻 

关键词:制作小程序,小程序商城,扫码点餐小程序,微信小程序开店的步骤,牛刀小程序

将会因为往下拉目录控制的弹出式往下拉目录的缘故致使Z轴高宽比失控。可是IE6有1个奇异的逻辑性,div 没法遮盖select,可是iframe 能够遮盖select,而div能够遮盖iframe,因此处理方法便是用Z轴高宽比更高的Iframe元素,包裹或遮盖住往下拉目录框控制,使其返回一切正常的Z轴高宽比上来!
处理方法1:Iframe包裹select元素
Code

拷贝编码
编码以下:

<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元素
Code

拷贝编码
编码以下:

.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;
}
<div class="T_div">
<span>这里能够包括别的dom元素</span>
<iframe class="T_iframe"></iframe>
</div>

这样嵌入了iframe的div就不怕被select划破了,方式1应用较为简易,可是运用存在局限,不能能在全部的select元素外加上iframe。方式2以问题为导向,在必须的div上面加上iframe,是普遍的处理方法。
ASP.NET2.0的服务器端控制Menu菜单控制在IE6下3D渲染的情况下,也遇到了select元素没法遮盖的难题,因此当载入了Menu菜单控制时,会全自动引入1个脚本制作文档,用加上iframe元素的方法来解决这个bug,当菜单项较为多的情况下,这个脚本制作解决会致使菜单载入时有显著的延迟时间,因此这个菜单控制還是无需为妙!
上一篇:css position 精准定位 返回下一篇:没有了