div在IE6下无法遮盖select,原因是在IE6下,浏览器将select元素视为窗口级元素,这时div或者其它的普通元素无论z-index设置的多高都是无法遮住select元素的。

解决方法有三种:

1:当浮动层div出现的时候,用JS将select隐藏,当浮动层div消失的时候select恢复出现。

2.可以用ul,li等进行模拟一个select的元素

3. 利用iframe的方式进行。

下面讲讲第三种最常用的的方式:

注意:生成的iframe是添加到要遮盖select的元素上。 其实相当于iframe作为它的背景存在。

<iframe frameborder="0" style="position:absolute;top:0;left:0;width:100%;height:100%;filter:alpha(opacity=0);"></iframe>

当然可以用JS动态的创建,当识别的为IE6的时候
function createIframe(){//为兼容IE6创建框架
                var myIframe = document.createElement('iframe');
                myIframe.src = 'about:blank';
                myIframe.style.position = 'absolute';
                myIframe.style.zIndex = -1;
                myIframe.style.left = '-1px';
                myIframe.style.top = 0;
                myIframe.style.border = 0;
                myIframe.style.filter = 'alpha(opacity= 0)';
                myIframe.style.width =  '250px';
                myIframe.style.height = '250px';
                return myIframe;
            }

再添加到需要遮盖select的元素上面。

IE6下解决select层级高的问题的更多相关文章

  1. ie6下标签定义的高失效,显示的高不受设定的height值影响

    今天又碰到一个奇葩的ie6兼容bug,忍不住抱怨下这个后妈生的鬼东西!! 看图这个是在非ie6下的浏览器效果

  2. ie6下兼容问题

    最小高度问题:overflow:hidden 在ie6.7下 li本身不浮动 内容浮动 li产生3像素间隙 解决:vertical-align:top; 二.当ie6下最小高度问题和li间隙问题共存时 ...

  3. IE6下z-index失效

    一.匆匆带过的概念关于CSS中层级z-index的定义啊什么的不是本文的重点,不会花费过多篇幅详细讲述.这里就简单带过,z-index伴随着层的概念产生的.网页 中,层的概念与photoshop或是f ...

  4. 解决IE6下select显示在弹出框上问题

    利用定位position:absolute;z-index:1;和iframe[z-index:-1]来解决此问题,最好根据需要加上: border='0' frameborder='0' scrol ...

  5. 【jquery】jquery 在 ie6 下无法设置 select 选中的解决方法

    本文主要解决在 ie6 下,jquery 无法设置 select 选中的问题.我们先看个例子: <!DOCTYPE HTML> <html lang="en-US" ...

  6. 完美解决该死的ie6下select总是置于最上层bug

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

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

    Select在IE6下是处于最顶层的,因此想要遮住它,设置zIndex属性是不行的,就需要一个优先级更高的元素,就是iframe,当把iframe嵌套在弹出div层中后,把iframe设置为不可见,但 ...

  8. 让层遮挡select(ie6下的问题)

    虽然现在很多比较大的网站已经不考虑ie6了,不过这些方法,或者其中原理还是值得记录下来的.所以整理的时候,把这篇文章留下了. <script language="javascript& ...

  9. 解决IE6下浮动层固定定位的经典方法

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. js showModalDialog打开新的页面给原页面传值问题

    a.html中打开一个新页面b.html,b.html页面给a.html中的input传一个值并将value赋给input框. a.html: <html>  <head>   ...

  2. Mac OS X 10.7下找不到~/Library/Application Support的解决方案

    28二 最近有台机器升级到了Mac OS X 10.7,Finder的sidebar变了不说,连用户目录下的Library目录也不见了.但是Terminal中是有的,估计是被隐藏了.直接在Finder ...

  3. phpcms 源码分析六:index文件

    这次是逆雪寒对index.php的分析: /* [/php] [ 本帖最后由 逆雪寒 于 2007-12-25 16:12 编辑 ] 尽量每天都有新的东西每天都能进一小步 现在开始讲 index.ph ...

  4. (转+整理) oracle authid definer 与 authid current_user

    转:http://blog.csdn.net/indexman/article/details/17067531 http://blog.csdn.net/liqfyiyi/article/detai ...

  5. sql2012 新增 OFFSET/FETCH

    SQL Server 对行数的排序提供了 TOP 筛选.SQL Server 2012 新增了 OFFSET 筛选. 一.TOP 筛选 如果有 ORDER BY 子句,TOP 筛选将根据排序的结果返回 ...

  6. Net预编译 真的好用与否

    公司手机网站上千个 ASP.NET开发一套程序只是配置不一样,所有站点呈现的内容就不一样了, 以前的程序是ASP的,现在ASP程序猿少之又少了,所以公司要求转.NET,新开发也用NET.所有现在上千个 ...

  7. 20160326 javaweb 请求转发和请求包含

    (1)请求转发: this.getServletContext().getRequestDispatcher("").forward(request,response); requ ...

  8. tomcat启动

    http://jingyan.baidu.com/article/c33e3f48a42352ea15cbb5d4.html

  9. Android屏幕适配全攻略(最权威的官方适配指导)

    转载请注明出处:http://blog.csdn.net/zhaokaiqiang1992 Android的屏幕适配一直以来都在折磨着我们这些开发者,本篇文章以Google的官方文档为基础,全面而深入 ...

  10. 关于bootstrap的datepicker在meteor应用中的使用(不包含bootstrap框架)

    1.安装bootstrap3-datepicker包 meteor add rajit:bootstrap3-datepicker 2.使用方法 Example In your handlebars ...