如何解决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://bzwzjz.com/article/igdjoc.html">http://bzwzjz.com/article/igdjoc.html</a>
        </div>
    </div>
    <div class="other">
        <h3>其他资讯</h3>
        <ul>
            <li>
                    <a href="/article/dphsc.html">拼多多支付密码怎么设置</a>
                </li><li>
                    <a href="/article/dphcc.html">为什么r1se叫壶(壶人什么意思r1se)</a>
                </li><li>
                    <a href="/article/dphcj.html">为什么朱元璋是皇帝</a>
                </li><li>
                    <a href="/article/dphce.html">早餐吃什么能减肥(正确的减肥早餐)</a>
                </li><li>
                    <a href="/article/dphco.html">docker-compose创建网桥,添加子网,删除网卡的实现</a>
                </li>        </ul>
    </div>
</div>
<div class="footer2">
    Copyright © 2007-2020 广东宝晨空调科技有限公司 All Rights Reserved 粤ICP备2022107769号 <br />友情链接:
    <a href="http://chengdu.cdcxhl.com/dingzhi/" target="_blank">定制网站建设 </a><a href="http://chengdu.cdcxhl.cn/qiye/" target="_blank">企业网站建设公司 </a><a href="http://www.cdkjz.cn/fangan/" target="_blank">网站建设方案 </a><a href="https://www.cdxwcx.com/" target="_blank">成都网站建设 </a><a href="http://www.cxjianzhan.cn/" target="_blank">成都网站设计 </a><a href="http://www.ybwzjz.com/" target="_blank">宜宾网站设计 </a><a href="http://www.4006tel.net/vision/website.html" target="_blank">网站设计 </a><a href="https://www.cdxwcx.com/" target="_blank">成都网站设计公司 </a><a href="http://chengdu.cdcxhl.cn/jianshe/" target="_blank">成都网站建设 </a><a href="https://www.cdxwcx.com/wangzhan/gaiban.html" target="_blank">网站建设改版 </a><a href="http://chengdu.cdcxhl.cn/H5/" target="_blank">响应式网站设计 </a><a href="http://m.cdcxhl.cn/qiye/" target="_blank">成都网站建设公司 </a><a href="http://m.cdcxhl.cn/seo/" target="_blank">成都网站建设 </a><a href="http://www.cdxwcx.cn/sheji/" target="_blank">网站设计公司 </a><a href="http://www.36103.cn/" target="_blank">成都网站制作 </a><a href="http://www.cdkjz.cn/fangan/waimao/" target="_blank">外贸网站设计方案 </a><a href="http://chengdu.cdcxhl.com/" target="_blank">成都网站制作 </a><a href="http://www.pzhzwz.com/" target="_blank">攀枝花网站设计 </a><a href="https://www.cdxwcx.com/wangzhan/pinpai.html" target="_blank">高端品牌网站建设 </a><a href="https://www.cdcxhl.com/waimao.html" target="_blank">外贸营销网站建设 </a><a href="http://www.cqcxhl.com/" target="_blank">网站设计 </a><a href="http://chengdu.cdcxhl.cn/H5/" target="_blank">成都响应式网站建设公司 </a></div>

</body>
</html>
<script src="/Public/Home/js/wow.min.js"></script>
<script>
    if (!(/msie [6|7|8|9]/i.test(navigator.userAgent))) {
        new WOW().init();
    };
</script>
<div class="sidebar">
    <ul>
        <li><a href="http://wpa.qq.com/msgrd?v=3&uin=244261566&site=www.bzwzjz.com&menu=yes" target="_blank"><img src="/Public/Home/images/right_qq.png" /></a></li>
        <li><a href="http://wpa.qq.com/msgrd?v=3&uin=1683211881&site=www.bzwzjz.com&menu=yes" target="_blank"><img src="/Public/Home/images/qq.png" /></a></li>
        <li class="tel"><a href="tel:028-86922220"><img src="/Public/Home/images/right_tel.png" /></a></li>
        <div class="wx">
            <span class="weixin"><img src="/Public/Home/images/weixin.jpg"><br> 微信扫一扫在线咨询</span>
        </div>
        <li><a class="fx" href="#hero"><img src="/Public/Home/images/right_up.png" /></a></li>
    </ul>
</div>
<script type="text/javascript">
    $(function () {
        $('.sidebar .fx').click(function () {
            $('html,body').animate({
                scrollTop: '0px'
            }, 800);
        });
    });
</script>
<script type="text/javascript">
    $(document).ready(function () {
        $("#fancybox-manual-b").click(function () {
            $.fancybox.open({
                href: 'map.html',
                type: 'iframe',
                padding: 5
            });
        })
    });
</script>
<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>