`
cary1130
  • 浏览: 197662 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

div覆盖select(IE6)

阅读更多
最近碰到个问题,到处查找,最终得到解决,现记录下。
问题:在IE6(更高版本的IE中无此问题)中DIV层被select给覆盖。
解决:使用frame作为垫板,代码示例如下
<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>

分享到:
评论
2 楼 你是救世主 2010-04-30  
同时也可以使用jquery的show hidden 方法很方便的解决。
1 楼 你是救世主 2010-04-30  
http://blogs.msdn.com/ie/archive/2006/01/17/514076.aspx
为什么不能解决

select  就是一个windows的对象。总是付在内容的上面。
不可以解决。

相关推荐

    ie6下DIV覆盖select框js解决代码

    ie6下DIV覆盖select框js解决代码

    解决IE6 中select 穿透 div 等层的问题

    解决IE6 中select 穿透 div 等层的问题

    div 模拟select 单选

    select 在ie6下覆盖div bug 解决方案。 div 模拟select 单选 在 body onload事件中调用init_select方法就可,参数传相关背景图片就可。我都已经放到资源包下了。

    ie6下select覆盖div的解决办法

    ie6下select覆盖div的解决办法

    解决 Ie 6下 select挡住div的通用函数

    /** * 让iframe 显示在 指定的div下面 针对ie6 select挡住div 的bug 采用 iframe来当作div的底 * * @param string divId 需要解决的div层 * @param string iframeId 采用的 IFRAME ,如果不指定 自动...

    IE6下Select元素被div等元素覆盖的解决办法

    但是IE6有一个神奇的逻辑,div 无法覆盖select,但是iframe 可以覆盖select,而div可以覆盖iframe,所以解决办法就是用Z轴高度更高的Iframe元素,包裹或覆盖住下拉列表框控件,使其回到正常的Z轴高度上来!...

    IE6升级到IE9兼容性问题和操作手册

    3. 已解决SELECT 元素不能被div覆盖的问题。 14 第二节:IE7-IE8更新 14 1. 不再支持 CSS 表达式,改为支持增强的 CSS 或 DHTML 逻辑。 14 2. currentStyle 对象的Unset属性现在返回其初始值。 15 3. style 对象的 ...

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

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

    jquery.bgiframe.js

    IE6下解决弹出div 被父页面的select 覆盖的问题,使用jquery 的dialog div 进行增加,删除,修改等操作。 这个是IE6下特有的问题。 下面是解决方法: 1.下载jquery.bgiframe.js ,在我的下载资源中有 2.需要修改...

    仿百度查询效果

    里面代码完成了百度搜索功能的基本功能,包括键盘控制上下选值的功能,以及完成对IE中DIV无法覆盖SELECT的问题。如果有什么更好的建议请留言,谢谢!

    iFrame的妙用作为弹出层铺底覆盖

    大家如果做过那种黑色遮罩盖住整张页面,而碰巧用户用的是IE6,更碰巧的是页面上有select元素,那就有得头疼了(原理就不在这里赘述了)。我们会发现弹出的DIV没法遮住select, 轮到我们的iframe出场了。逻辑如下: ...

    JavaScript Table行定位效果

    首先想到的方法是给tr设置relative,用ie6/7测试以下代码: Code &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; ; left:100px...

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

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

    HTML中iFrame标签的两个用法介绍

     大家如果做过那种黑色遮罩盖住整张页面,而碰巧用户用的是IE6,更碰巧的是页面上有select元素,那就有得头疼了(原理就不在这里赘述了)。我们会发现弹出的DIV没法遮住select, 轮到我们的iframe出场了。逻辑如下:...

    图片放大镜

    if(document.all){ //只在IE下执行,主要避免IE6的select无法覆盖 magnifier.createIframe(magnifier.m.img); } this.onmousemove = magnifier.move; //this指向m.cont this.onmouseout = magnifier.end; }, ...

    ExtAspNet_v2.3.2_dll

    -Grid中TemplateField生成到页面中控件具有唯一ID,例如Grid1_ct5_Label2,Grid1_ct6_Label2(feedback:geruger)。 +2009-09-27 v2.1.2 -为Tree控件增加GetExpandAllNodesReference和...

    商用版本文本编辑器DotNetTextBoxV6.0.8Source 源码

    3)修正保存远和图片到本地功能在IE6及IE7的提交BUG。 4)修正上传图片界面中对齐方式不能生效的BUG! 2010/01/15 Version 6.1.4 For VS2005/2008 Updates: 1)加入保存远程图片到本地的功能图标到菜单栏,配置代码为...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    -Grid中TemplateField生成到页面中控件具有唯一ID,例如Grid1_ct5_Label2,Grid1_ct6_Label2(feedback:geruger)。 +2009-09-27 v2.1.2 -为Tree控件增加GetExpandAllNodesReference和...

    DotNetTextBox V6.0.10 商业版 下载 (已知最新)

    6)增加AjaxSupport目录,使用此目录的文件覆盖原版同名文件后重新编译即可解决在Asp.Net Ajax UpdatePanel下工作不正常的BUG!(不需要使用asp.net ajax的用户无需覆盖此目录的文件) 7)增加asp.net ajax的演示例子...

Global site tag (gtag.js) - Google Analytics