189 8069 5689

如何解决DIV在IE6下无法遮盖select

这期内容当中小编将会给大家带来有关如何解决DIV在IE6下无法遮盖select,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。

成都创新互联公司是一家专业提供金山企业网站建设,专注与成都网站建设、做网站、H5响应式网站、小程序制作等业务。10年已为金山众多企业、政府机构等服务。创新互联专业网站设计公司优惠进行中。

你对DIV浮层在IE6下无法遮盖select标签是否了解,这里和大家一起讨论一下,其实很早以前我就碰到过关于select元素的问题,但是为什么IE7和FF下DIV都可以遮住select标签,会为你揭秘。

JavaScript巧解IE6 IE7 IE8兼容问题

这次讨论一下关于select元素的一个问题,其实很早以前我就碰到过关于select元素的问题,这次做网站又被问到同样的问题,就是:一般DIV浮层在IE6下无法遮盖selectaspxhome.com/search.asp?keyword=%b1%ea%c7%a9" target=_blank>标签,IE7和FF下DIV都可以遮住select标签。

列举个简单的实例阐述问题:

 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    无标题文档title> <style type="text/CSS"> #warp { position:absolute; top:10px; left:26px; width:200px; height:200px;}  .box { position:absolute; top:0; left:0; width:200px;    height:200px; background:#FDF3D9; border:1px solid #EEAC53}  style> head>  <body> <DIV id="warp">   <DIV class="box">dfsagdsaDIV> DIV> <form id="form1" name="form1" method="post" action=""> <label> <select name="select" id="select">   <option>测试选项option>   <option>测试选项2option>   <option>测试选项3option> select> label> form> body> html></pre><p>[提示:你可先修改部分代码,再按运行]</p><p><img src="/upload/otherpica43/487135.jpg" alt="如何解决DIV在IE6下无法遮盖select"></p><p>DIV在IE6下无法遮盖select,原因是在IE6下,浏览器将select元素视为窗口级元素,这时DIV或者其它的普通元素无论z-index设置的多高都是无法遮住select元素的。</p><p><strong>网上有两种解决办法:</strong></p><p>◆当浮动层DIV出现的时候,用JS将select隐藏,当浮动层DIV消失的时候select恢复出现。这种方法早期用的比较多,这里不多介绍。</p><p>◆ 用select同级别元素:iframe标签,<iframe frameborder="0"></iframe> 然后用实际的浮动层DIV和iframe放在一起。间接的使DIV遮住了select。</p><p>正确的代码:</p><pre> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档title> <style type="text/CSS"> #warp { position:absolute; top:10px; left:26px; width:200px; height:200px;}  .box { position:absolute; top:0; left:0; width:200px;    height:200px; background:#FDF3D9; border:1px solid #EEAC53}  .box iframe {width:400px; height:400px; z-index:-1}  style> head>  <body> <DIV id="warp">   <iframe frameborder="0">iframe>   <DIV class="box">dfsagdsaDIV> DIV> <form id="form1" name="form1" method="post" action=""> <label> <select name="select" id="select">   <option>测试选项option>   <option>测试选项2option>   <option>测试选项3option> select> label> form> body> html></pre><p>[提示:你可先修改部分代码,再按运行]</p><p><img src="/upload/otherpica43/487136.jpg" alt="如何解决DIV在IE6下无法遮盖select"></p><p>上述就是小编为大家分享的如何解决DIV在IE6下无法遮盖select了,如果刚好有类似的疑惑,不妨参照上述分析进行理解。如果想知道更多相关知识,欢迎关注创新互联行业资讯频道。</p>            
            
                        <br>
            本文标题:如何解决DIV在IE6下无法遮盖select            <br>
            链接地址:<a href="http://gzruizhi.cn/article/igdjoc.html">http://gzruizhi.cn/article/igdjoc.html</a>
        </div>
    </div>
    <div class="other">
        <h3>其他资讯</h3>
        <ul>
            <li>
                    <a href="/article/eesid.html">Wireshark工具介绍-创新互联</a>
                </li><li>
                    <a href="/article/eesed.html">机器学习入门-1.介绍与决策树(decisiontree)-创新互联</a>
                </li><li>
                    <a href="/article/eesds.html">Vue实现手动刷新组件的方法-创新互联</a>
                </li><li>
                    <a href="/article/eessg.html">TortoiseSVN系列:(2)使用-创新互联</a>
                </li><li>
                    <a href="/article/eessp.html">android源码编译相关-创新互联</a>
                </li>        </ul>
    </div>
</div>
<footer>
  <div class="foot container">
    <div class="footl fl">
      <h3>联系我们</h3>
      <dl>
        您好HELLO!<br>
        感谢您来到宜宾网站建设公司,若您有合作意向,请您为我们留言或使用以下方式联系我们,

        我们将尽快给你回复,并为您提供真诚的设计服务,谢谢。
      </dl>
      <ul>
        <li>电话:028- <span>86922220 18980695689</span></li>
        <li>商务合作邮箱:631063699@qq.com</li>
        <li>合作QQ: 532337155</li>
        <li>成都网站设计地址:成都市青羊区锣锅巷31号五金站写字楼6楼</li>
      </ul>
    </div>
    <div class="footr fr">
      <h3>冠赛建站工作室</h3>
      <dl>
        宜宾冠赛网站建设公司拥有多年以上互联网从业经验的团队,始终保持务实的风格,以"帮助客户成功"为已任,专注于提供对客户有价值的服务。

        我们已为众企业及上市公司提供专业的网站建设服务。我们不只是一家网站建设的网络公司;我们对营销、技术、管理都有自己独特见解,冠赛建站采取“创意+综合+营销”一体化的方式为您提供更专业的服务!
      </dl>
      <h3>冠赛观点</h3>
      <dl>
        相对传统的宜宾网站建设公司而言,冠赛是互联网中的网站品牌策划,我们精于企业品牌与互联网相结合的整体战略服务。<br>
        我们始终认为,网站必须注入企业基因,真正使网站成为企业vi的一部分,让整个网站品牌策划体系变的深入而持久。
      </dl>
    </div>
  </div>
  <div class="link">
    <div class="container"> <span> 友情链接:</span>
        <a href="http://www.cdkjz.cn/fangan/door/" title="成都门户网站建设设计方案" target="_blank">成都门户网站建设设计方案</a>   <a href="http://www.cdsjymy.cn/" title="成都路面机械设备" target="_blank">成都路面机械设备</a>   <a href="https://www.cdcxhl.com/app.html" title="app软件定制开发" target="_blank">app软件定制开发</a>   <a href="http://www.cdxwcx.cn/tuoguan/jianyang.html" title="简阳机房托管" target="_blank">简阳机房托管</a>   <a href="http://www.cdxwcx.cn/tuoguan/mianyang.html" title="绵阳电信机房" target="_blank">绵阳电信机房</a>   <a href="http://www.gtmaxf.cn/" title="消防工程" target="_blank">消防工程</a>   <a href="http://m.cdcxhl.cn/dingzhi/
" title="定制网站" target="_blank">定制网站</a>   <a href="http://www.cdxwcx.cn/tuoguan/yaan.html" title="雅安服务器托管" target="_blank">雅安服务器托管</a>   <a href="http://www.jtfdjwx.com/" title="金堂发电机" target="_blank">金堂发电机</a>   <a href="https://www.cdcxhl.cn/
" title="腾讯云香港空间" target="_blank">腾讯云香港空间</a>       </div>
  </div>
  <div class="copy"> © Copyright 2023 <a href="http://www.gzruizhi.cn">冠赛建站工作室</a>All Rights Reserved.  <a href="http://beian.miit.gov.cn" target="_blank" rel="nofollow">黔ICP备2021005940号-3</a>  <a href="https://www.cdxwcx.com" target="_blank">成都网站建设</a> / <a href="https://www.cdxwcx.com" target="_blank">成都网站建设</a> / <a href="https://www.cdxwcx.com" target="_blank">响应式网站建设</a> / <a href="https://www.cdcxhl.com" target="_blank">成都网站设计</a>  <a href="https://www.cdcxhl.com/service/weihu.html" target="_blank">成都网站维护</a> <a href="https://www.cdcxhl.com/news/" target="_blank">其他新闻分类</a> </div>
</footer>
</body>
</html>
<script>
    $(".con img").each(function(){
        var src = $(this).attr("src");    //获取图片地址
        var str=new RegExp("http");
        var result=str.test(src);
        if(result==false){
            var url = "https://www.cdcxhl.com"+src;    //绝对路径
            $(this).attr("src",url);
        }
    });
    window.onload=function(){
        document.oncontextmenu=function(){
            return false;
        }
    }
</script>