`
hhr_michael
  • 浏览: 72668 次
  • 性别: Icon_minigender_1
  • 来自: 惠州
社区版块
存档分类
最新评论

关于DIV被SELECT遮挡问题

UP 
阅读更多
<html>  
  <head>  
    <script>  
      function   DivSetVisible(state)  
      {  
        var   DivRef   =   document.getElementById('PopupDiv');  
        var   IfrRef   =   document.getElementById('DivShim');  
        if(state)  
        {  
          DivRef.style.display   =   "block";  
          IfrRef.style.width   =   DivRef.offsetWidth;  
          IfrRef.style.height   =   DivRef.offsetHeight;  
          IfrRef.style.top   =   DivRef.style.top;  
          IfrRef.style.left   =   DivRef.style.left;  
          IfrRef.style.zIndex   =   DivRef.style.zIndex   -   1;  
          IfrRef.style.display   =   "block";  
        }  
        else  
        {  
          DivRef.style.display   =   "none";  
          IfrRef.style.display   =   "none";  
        }  
      }  
    </script>  
  </head>  
  <body>  
    <form>  
      <select>  
        <option>A   Select   Box   is   Born   ....</option>  
      </select>  
    </form>  
    <div  
      id="PopupDiv"  
      style="position:absolute;   top:25px;   left:50px;   padding:4px;   display:none;   background-color:#000000;   color:#ffffff;   z-index:100">  
      ....   and   a   DIV   can   cover   it   up<br>through   the   help   of   an   IFRAME.  
    </div>  
    <iframe  
      id="DivShim"  
      src="javascript:false;"  
      scrolling="no"  
      frameborder="0"  
      style="position:absolute;   top:0px;   left:0px;   display:none;">  
    </iframe>  
    <br>  
    <br>  
      <a   href="#"   onclick="DivSetVisible(true)">Click   to   show   DIV.</a>  
    <br>  
    <br>  
      <a   href="#"   onclick="DivSetVisible(false)">Click   to   hide   DIV.</a>  
  </body>  
  </html>  

其实实质就是在DIV下面铺一层东西(iframe)，档一下Select.

分享到：
| iText加入页码
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    解决div总是被select遮挡的问题.rar

    介绍： 效果演示：麦田圈 只要在层里面加上下面代码就可以了~ &lt;iframe src="" frameborder=0&gt;&lt;/iframe&gt;

    最顶层div被flash或者下拉列表遮挡的问题解决

    你可以用 深度（z-index）试试。下面是举的一个小例子： #a{ position:absolute; top:80px; left:100px; z-index:1; } #b{ position:absolute; top:70px; left:160px; z-index:0; }

    ie6下select遮挡div

    由于select是window控件，它会遮挡被定位的元素，可以使用该jquery插件解决问题.这里有详细的举例说明.

    layui layer select 选择被遮挡的解决方法

    在编程的时候, layer弹窗中的select 经常会遇到被遮挡的情况： 解决方法：在页面里面找到对应div的class 给overflow新的属性visible即可(默认值。内容不会被修剪，会呈现在元素框之外。)即可显示出下拉框 1.找到层...

    解决IE6中 Div层挡不住Select组件

    NULL 博文链接：https://wangyispider.iteye.com/blog/788810

    div总是被select遮挡的解决方法

    个方法好像可行，但前提是div层的大小、位置可知，对于在后台js文件中控制style的div就实效了。 我遇到的恰好就是这种情况，所以太遗憾了。 不过这个帖子还是应该收藏一下。

    option挡住div解决方法

    Div被Select挡住，是一个比较常见的问题。 有的朋友通过把div的内容放入iframe或object里来解决。 可惜这样会破坏页面的结构，互动性不大好。 这里采用的方法是： 虽说div直接盖不住select 但是div可以盖iframe，而...

    Div Select挡住的解决办法

    Div下拉菜单被Select挡住的解决办法&lt;/title&gt; &lt;/head&gt;&lt;body&gt; &lt;div style=”z-index: 10; position: absolute; width: 100; height: 18; overflow: hidden;” onmouseover=”this....

    select网页下拉列表与div层遮盖问题

    在html中关于select元素的问题在很多地方都提出过，而在前段...相关文章：div层被flash层遮盖问题解决思路 第一就是比较有名的：一般div浮层在IE6下无法遮盖select元素的问题。首先提供了下面一个实例： 注解：如果

    解决div总是被select遮挡的问题特效代码

    介绍： 效果演示：麦田圈 只要在层里面加上下面代码就可以了~ iframe src= style=width:800px;height:536px;top:0px;left:0px;position:absolute;visibility:inherit;z-index:-1; frameborder=0/iframe

    IE6 select z-index无效，遮挡div bug的解决方法

    今天我说说iframe解决的一般方法，已经使用jQuery插件bgiframe解决IE6 select z-index无效，遮挡div的bug。 解决方法之一：Iframe包裹select元素 使用iframe包住select，这样iframe有z-index，只要在div上设置的z-...

    ie6 select无法被div遮盖的bug解决方法

    使用div制作蒙版或模拟弹出窗口，但在IE6下，当div下方有下拉列表框select元素的时候，下拉列表框会划破div显示在div之上，不论z-index设为何值均会出现此问题，可能由于下拉列表控件的弹出式下拉列表的原因导致Z轴...

    Js制作简单弹出层DIV在页面居中 中间显示遮罩的具体方法

    可以遮挡ie6下的select元素 但是在ie6下div没有透明度 2.弹出的div可以一直在浏览器屏幕中间显示 问题: 1.目前不支持.class 只支持#id 2.需要显示的div需要自己设置css 3.在ie6下需要设置css 例如div {_position: ...

    layui: layer.open加载窗体时出现遮罩层的解决方法

    今天小编就为大家分享一篇layui: layer.open加载窗体时出现遮罩层的解决方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧

    asp.net 自定义DropDownList(CustomDropDownList)（上一个有点bug）

    用DataGrid基于jQuery(实际上只用了它的按照类查找元素一个方法)写的自定义DropDownList，解决不能控制生成后的Select html控件不能控制zIndex而遮挡Div层及其他复杂样式，没有封装成dll，压缩包里是例子及所有用到...

    asp.net 自定义DropDownList(CustomDropDownList)

    用DataGrid基于jQuery(实际上只用了它的按照类查找元素一个方法)写的自定义DropDownList，解决不能控制生成后的Select html控件不能控制zIndex而遮挡Div层及其他复杂样式，并且可以自动回发到服务器，没有封装成dll...

    无限菜单之 xml+popup 版(IE5.5+)

    可以不用担心被下拉框、flash、Iframe等这些东西遮挡； 一个Popup窗口打开后，当在它的区域以外点击或者另一个Popup窗口被打开时都会自动关闭； Popup窗口是没有焦点的； 用户不能改变Popup窗口大小； Popup...

    ExtAspNet_v2.3.2_dll

    -v0.2beta2版本中关于PersistChildren(true)的描述有误，这个是设计时属性，和运行时是否保持状态没有关系。 -修正CheckBox控件的CheckedChanged事件会被触发两次的BUG（Data PostBack-&gt;AutoPostBack, Event ...

    ExtAspNet v2.2.1 （2009-4-1） 值得一看

    -v0.2beta2版本中关于PersistChildren(true)的描述有误，这个是设计时属性，和运行时是否保持状态没有关系。 -修正CheckBox控件的CheckedChanged事件会被触发两次的BUG（Data PostBack-&gt;AutoPostBack, Event ...

Magicbox
Global site tag (gtag.js) - Google Analytics