IE6下select被这罩住

在我们做弹出遮罩层时经常遇到这种问题,就是select被这罩住不兼容IE6,其实解决这种问题并不难,只要掌握住原理就挺简单的。

首先就是当遮罩层出现时select要暂时隐藏,但是不能用display:none;

要用visibility:hidden;这样select的虽然隐藏但位置还在。

下面是js代码:

<script language="javascript">
function f(o){
o.style.display = "none";
document.getElementBy Id("hidediv").style.display = "";
var sels = document.getElementsBy Tag Name("SELECT");
for(var i=0; i<sels.length; i++){
sels[i].style.visibility = "hidden";
}
}
</script>

下面是html代码:

<div><select style="margin:10px 0 0 200px"><option>IE6下select被这罩住</option></select>
</div>

<div><select style="margin:10px 0 0 200px"><option>IE6下select被这罩住</option></select>
</div>

<div><select style="margin:10px 0 0 200px"><option>IE6下select被这罩住</option></select>
</div><div id="hidediv" style="display:none;position: absolute; z-index:100; left: 0px; top: 0px; background:#000; width: 100%; opacity: 0.3;filter:Alpha(opacity=30); height: 2000px;">
<iframe style="width:100%;height:100%;filter:Alpha(opacity=0);" border="0" frameborder="0"></iframe>
</div>
<button onclick="f(this);">显示遮罩层</button>

时间: 2024-10-15 15:14:14

IE6下select被这罩住的相关文章

IE6下select覆盖div z-index无效 解决方案

遇到了IE6 select遮挡div的bug,这个bug表现为页面有浮动元素(某个div元素)在select上面时,在IE6里面select总是显示在这个浮动元素上方,该元素z-index的值多大都没有作用. 解决的思路是:IE6中iframe可以覆盖select,而div可以覆盖iframe,所以解决办法就是使用iframe元素包裹或者覆盖select元素或浮动元素,或者在select元素或浮动元素添加一个Iframe作为子元素. 方法一:Iframe包裹select元素  使用iframe包

IE6下弹出层被select遮挡的解决

一些使用定位的弹出层在IE6下会被select遮挡,通过调整弹出层的z-index并不能解决问题,其实在弹出层中加一个iframe即可解决. 在弹出层加入代码如下: <div class="dialog"><!--我是弹出层--> <!--我是iframe--> <div style="position:absolute;z-index:-1;left:0;top:0;width:100%;height:100%;">

IE6下解决select层级高的问题

div在IE6下无法遮盖select,原因是在IE6下,浏览器将select元素视为窗口级元素,这时div或者其它的普通元素无论z-index设置的多高都是无法遮住select元素的. 解决方法有三种: 1:当浮动层div出现的时候,用JS将select隐藏,当浮动层div消失的时候select恢复出现. 2.可以用ul,li等进行模拟一个select的元素 3. 利用iframe的方式进行. 下面讲讲第三种最常用的的方式: 注意:生成的iframe是添加到要遮盖select的元素上. 其实相当

IE6下div层被select控件遮住的问题解决方法

Select在IE6下是处于最顶层的,因此想要遮住它,设置zIndex属性是不行的,就需要一个优先级更高的元素,就是iframe,当把iframe嵌套在弹出div层中后,把iframe设置为不可见,但它使弹出的div能浮于select等一些元素之上,因此完美解决了此问题,如下是需要弹出的Div代码,星号内代码为添加的iframe: <div id="quest"> <!--*******************************iframe***********

IE6下的一些DIV适配总结

想到些以前的东西随便写下,在新丰两建网开发中,,使用了完全的div布局,由于对方要求,左侧应用栏要能活动,只能使用3列的方式.政府又广泛使用ie6,其实最好用table来做 这 时就暴露了IE6下div的一个适应问题,IE6下默认的margin-bottom不是0的,而是有一个固定的数,如果不制定div大小和相关属性,让 div在ie6下自动适配,那和火狐和ie9是不同的.最后的解决方法是全部div指定大小和相关属性.其实正确的方法是一开始开发的时候就进行处理, 在过程中还有个问题,就是在网站开

ie6下 gif动画不动

ie6下 gif动画不动 如果有onclick事件:在IE6中,点击a标签,onclick事件会先执行,其次是href下的动作,href执行后,默认会执行跳转动作(尽管href属性不一定是一个地址),于是页面中的加载就停止了,gif图片就停止播放了.这个应该是IE6底层机制的bug.解决办法:就是在onclick事件后加上return false,这时href就不会被执行.古怪的问题也就搞定了. 如果没有onclick事件,在浏览器里单独浏览图片仍然不动,很有可能是浏览器的设置问题:工具--in

ie6下兼容问题

最小高度问题:overflow:hidden 在ie6.7下 li本身不浮动 内容浮动 li产生3像素间隙 解决:vertical-align:top; 二.当ie6下最小高度问题和li间隙问题共存时 给li加浮动 滤镜:标准浏览器[opacity:0.5] ie6[filter:alpha(opacity=50)] 图片底部3像素问题:vertical-align:top; padding是占位置的. ie6下 子元素会撑开父级设置好的宽高  : 计算一定要正确,不要让内容的宽高,超出设置的宽

IE6下的效果

1. IE6有宽度border实现透明 如果想使得边框颜色透明,在其余浏览器下比较简单,直接使用:border-color:transparent;但在IE6下这个办法不行,可以通过下面的方式实现: _border-color:tomato; _filter:chroma(color=tomato); 或者: _border-color:#FFFFFF; _filter:chroma(color=#FFFFFF); 或者: _border-color:#FFFFFF; _filter:progi

IE6下的怪异解析知识点补充

转载请注明出处:HTMl5自由者       IE6下的怪异解析知识点补充,布布扣,bubuko.com