zoukankan      html  css  js  c++  java
  • 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的元素上。 其实相当于iframe作为它的背景存在。

    <iframe frameborder="0" style="position:absolute;top:0;left:0;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的元素上面。

  • 相关阅读:
    System.Diagnostics.Conditional 的妙用 -- 把文档放在代码中
    UGUI 特效怎样在UI上裁剪
    通过GL函数处理图片以及其它相关功能
    每次都能让人头大的 Shader -- 从整合说起
    每次都能让人头大的 Shader -- 从一次简单的功能说起
    由于闭包引起的内存泄漏
    较为激进的基础框架
    UGUI 逻辑以及实用性辅助功能
    单相机做分屏混合
    AssetBundleMaster_ReadMe_EN
  • 原文地址:https://www.cnblogs.com/heimanba/p/3826030.html
Copyright © 2011-2022 走看看