RELATEED CONSULTING
相关咨询
选择下列产品马上在线沟通
服务时间:8:30-17:00
你可能遇到了下面的问题
关闭右侧工具栏

新闻中心

这里有您想知道的互联网营销解决方案
如何解决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://tyjierui.cn/article/igdjoc.html">http://tyjierui.cn/article/igdjoc.html</a>
                                            </div>
                                            <div class="hot_new">
                                                <div class="page_title clearfix">
                                                    <h3>其他资讯</h3>
                                                </div>
                                                <div class="news_list clearfix">
                                                    <ul>
                                                        <li>
                                                                <a href="/article/sjog.html">冰鲜和冷冻海鲜哪个好_冷冻海鲜和新鲜海鲜营养价值</a>
                                                            </li><li>
                                                                <a href="/article/sjdg.html">梁武帝为什么会三次舍身同泰寺,还提倡和尚全吃素?</a>
                                                            </li><li>
                                                                <a href="/article/sjej.html">匡衡凿壁偷光如此刻苦学习长大后的匡衡又做了什么事情</a>
                                                            </li><li>
                                                                <a href="/article/sjsc.html">idle是什么意思(yacht是什么意思)</a>
                                                            </li><li>
                                                                <a href="/article/sjpo.html">道光皇帝最美的皇后是怎么死的?</a>
                                                            </li>                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 底部信息 -->
<div class="footer wow fadeInUp">
    <div class="rowFluid">
        <div class="span12">
            <div class="container">
                <div class="footer_content">
                    <div class="span4 col-xm-12">
                        <div class="footer_list">
                            <div class="span6">
                                <div class="bottom_logo"><img src="/Public/Home/images/ewm.jpg" alt="微信服务号二维码" /></div>
                            </div>
                            <div class="span6 col-xm-12">
                                <div class="quick_navigation">
                                    <div class="quick_navigation_title">快速导航</div>
                                    <ul>
                                        <li><a href="https://www.cdxwcx.com/wangzhan/mbqiye.html" title="成都企业网站制作" target="_blank">成都企业网站制作</a></li><li><a href="http://www.hlhk555.cn/" title="航龙航空" target="_blank">航龙航空</a></li><li><a href="http://www.nzanhua.com/" title="四川雕琢时光" target="_blank">四川雕琢时光</a></li><li><a href="https://www.cdcxhl.com/zuyong/" title="成都租用服务器" target="_blank">成都租用服务器</a></li><li><a href="http://www.75101.cn/" title="成都网站建设" target="_blank">成都网站建设</a></li><li><a href="http://www.kjdeyu.com/" title="营山母婴护理" target="_blank">营山母婴护理</a></li><li><a href="https://www.cdcxhl.cn/
" title="腾讯云免备案主机" target="_blank">腾讯云免备案主机</a></li>                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="span4 col-xm-6 col-xs-12">
                        <div class="footer_list">
                            <div class="footer_link">
                                <div class="footer_link_title">友情链接</div>
                                <ul id="frientLinks">
                                    <a href="https://www.cdcxhl.com/" title="网站制作" target="_blank">网站制作</a>
                                    <a href="https://www.cdcxhl.com/" title="网站建设" target="_blank">网站建设</a>
                                    <a href="https://www.cdxwcx.com/tuiguang/" title="成都网络推广" target="_blank">网络推广</a>
                                    <a href="http://seo.cdkjz.cn/" title="成都网站推广" target="_blank">网站推广</a>
                                    <a href="https://www.cdcxhl.com/xiaochengx.html" title="成都微信小程序开发" target="_blank">小程序开发</a>
                                    <a href="https://www.cdcxhl.com/menu.html" title="创新互联网站栏目导航" target="_blank">网站导航</a>
                                </ul>
                                <div class="footer_link_title">网站建设</div>
                                <ul id="frientLinks">
                                    <li><a href="/">绵竹浩晨建站</a></li>
                                    <li><a href="https://www.cdcxhl.com/menu.html" title="创新互联网站栏目导航" target="_blank">网站导航</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="span4 col-xm-6 col-xs-12">
                        <div class="footer_list">
                            <div class="footer_cotact">
                                <div class="footer_cotact_title">联系方式</div>
                                <ul>
                                    <li><span class="footer_cotact_type">企业:</span><span class="footer_cotact_content">青羊区浩晨众云设计工作室</span></li>
                                    <li><span class="footer_cotact_type">地址:</span><span class="footer_cotact_content">成都市青羊区太升南路288号</span></li>
                                    <li><span class="footer_cotact_type">电话:</span><span class="footer_cotact_content"><a href="tel:18980820575" class="call">18980820575</a></span></li>
                                    <li><span class="footer_cotact_type">网址:</span><span class="footer_cotact_content"><a href="/" title="绵竹网站建设">www.tyjierui.cn</a></span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="copyright">
                <p>公司名称:青羊区浩晨众云设计工作室(个体工商户)   联系电话:18980820575</p>
                <p><a href="http://beian.miit.gov.cn" target="_blank" rel="nofollow">网站备案号:蜀ICP备2025119795号-3</a></p>
                <p>绵竹浩晨建站 绵竹网站建设 绵竹网站设计 绵竹网站制作 <a href="http://www.cdxwcx.cn/" target="_blank">成都做网站</a></p>
            </div>
        </div>
    </div>
</div>
</body>
</html>
<script>
    $(".technical_support_box_z_info_box 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>