zoukankan      html  css  js  c++  java
  • 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; 100%; opacity: 0.3;filter:Alpha(opacity=30); height: 2000px;">
    <iframe style="100%;height:100%;filter:Alpha(opacity=0);" border="0" frameborder="0"></iframe>
    </div>
    <button onclick="f(this);">显示遮罩层</button>

  • 相关阅读:
    vue --- 脚手架初始化项目中配置文件webpack.base.conf.js代码含义
    Chrome
    es8 --- 新特性
    es7 --- 新特性
    vue --- 关于多个router-view视图组件,渲染同一页面
    vue ---- 组件传值之间使用 v-model
    vue --- watch 高级用法
    js --- 递归结构图
    es6 --- Generator 函数
    es6 -- set 数据结构
  • 原文地址:https://www.cnblogs.com/hellman/p/4172231.html
Copyright © 2011-2022 走看看