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

使用Iframe解决IE6下Div/UL/Li 挡不住Select box 的3法

阅读更多
1) 基础套路:
<IFRAME src="" frameborder="0" scrolling="no" style="position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:-1;"></IFRAME>

一般在需要的DIV上加入这段代码就可以挡住后面的select box了。

2)有时IE6下IFrame的background-color属性无法设置,始终为 #FFF
可加入一个空白的页blank.html。则iframe引用后,可使iframe使用 blank.html的背景色
<IFRAME src="\resource\include\blank.html" frameborder="0" scrolling="no" style="position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:-1;"></IFRAME>

blank.html代码:
<body style="background-color:#F4F4F4;"></body>

加上这个blank.html之后我的iframe就可以与背景色为#F4F4F4的父div融为一体了

3)也有时IFrame的高度自适应(height:100%)失效,无法完全遮挡住下面的Select。需要加入filter:Alpha(Opacity=0);border:solid; 属性
<IFRAME frameBorder="0" style="position:absolute;left:0;top:0;width:100%;z-index:-1;filter:Alpha(Opacity=0);border:solid;"></IFRAME>


仅在IE6中显示,需要将iframe的html放在如下标签中
<!--[if IE 6]> 。。。<![endif]-->

或者更严谨一些放在下面的标签中:
<![CDATA[<!--[if IE 6]> 。。。 <![endif]-->]]>

分享到:
评论

相关推荐

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

    "解决IE6中 Div层挡不住Select组件"这个问题是一个典型的例子,它反映了IE6在CSS层叠样式和Z-index处理上的独特行为。 在现代浏览器中,我们可以利用CSS的`z-index`属性来控制元素的前后堆叠顺序,从而让某些元素...

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

    在互联网的早期,Internet Explorer 6 (简称IE6) 是一款广泛应用的浏览器,但它的兼容性和渲染机制存在诸多问题,其中一个问题就是“select穿透div”的现象。这个问题在现代浏览器中通常不会出现,但在IE6中,`...

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

    总结来说,解决IE6下`div`覆盖`select`框的问题需要理解浏览器的层叠上下文规则,并利用JavaScript动态调整元素的样式。虽然这种问题在现代浏览器中很少出现,但在维护旧项目或考虑跨浏览器兼容性时,理解并掌握这种...

    ie6下select覆盖div的解决办法

    总的来说,解决IE6下的Select覆盖Div问题需要根据实际情况灵活运用上述方法。在现代浏览器广泛使用的今天,虽然IE6的市场份额已经非常小,但考虑到部分用户可能还在使用,开发者仍需关注此类兼容性问题。在解决这类...

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

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

    ie6下select遮挡div

    标题“ie6下select遮挡div”指出的是一个典型的IE6特有的问题:当在网页上使用select下拉框时,它会覆盖在其他使用绝对或相对定位的元素(如div)之上,导致这些元素无法正常显示。这个问题对于设计美观且交互性强的...

    div被iframe遮住的几种情况及解决方法

    在这种情况下,解决方案是为DIV设置一个不透明的背景颜色,或者使用透明的背景图片。 第二种情况是IE8浏览器中Z-index失效的问题。在IE8中,当IFRAME内部嵌入video元素进行视频播放时,可能会导致外部元素的z-index...

    Jquery 解决IE6 Select 框总是在图层(div)的上面显示的BUG

    本文将深入探讨如何利用jQuery解决一个特定的问题:在IE6下,Select元素总是显示在具有较高z-index的图层(如div)之上。 首先,我们要理解z-index的概念。在CSS中,z-index是一个用于控制元素在垂直方向(即Z轴)...

    解决IE6下三级下拉菜单被select遮挡的问题.docx

    总结来说,解决IE6下三级下拉菜单被`&lt;select&gt;`遮挡的问题主要通过以下两步: 1. 在下拉菜单元素之前插入一个透明的`&lt;iframe&gt;`,提高菜单的z-index层次。 2. 使用CSS控制菜单的布局和交互效果,包括定位、浮动、显示...

    IE6下div层被select控件遮住的问题解决方法

    总结来说,面对IE6中的`div`层被`select`控件遮住的问题,我们可以利用`iframe`作为遮罩,并通过设置`z-index`和动态调整`iframe`尺寸的方法来解决。虽然这个方法在现代浏览器中可能不再适用,但对于仍然需要支持IE6...

    解决DIV在IE下被下拉列表select穿透的问题(二)

    标题"解决DIV在IE下被下拉列表select穿透的问题(二)"所提及的,是一个典型的IE浏览器特有的问题。这个问题涉及到HTML中的`&lt;div&gt;`元素和`&lt;select&gt;`下拉列表之间的交互,具体表现为在Internet Explorer(特别是旧版本...

    Iframe高度自适应(兼容IE/Firefox、同域/跨域)

    例如,IE6/7不支持`contentWindow`,可能需要使用`document.frames['iframeID'].document`来访问Iframe的内容。 4. **同域与跨域**: - 同域是指Iframe加载的页面与包含它的页面在同一域名下,这时可以无障碍地...

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

    在本案例中,"解决div总是被select遮挡的问题.rar"提供了解决方案,通过引入一个透明的`iframe`来规避这一现象。 首先,我们需要理解Z轴顺序的概念。在CSS中,`z-index`属性用于指定元素在堆叠上下文中的层级。具有...

    用DIV仿iframe框架布局效果

    - 虽然iframe可以处理跨域问题,但用DIV仿iframe布局时,需要自行解决这个问题。可以使用`window.postMessage` API进行跨窗口通信,使得父页面和子页面(实际是同一个页面的不同部分)可以安全地交换信息。 4. **...

    div覆盖 iframe

    在描述中提到的“前辈的成果,显示所需要的页面,第一个页面隐藏”,可能指的是使用`div`作为初始页面,然后通过某种用户交互(如点击按钮)来显示`iframe`内容,同时`div`作为背景或者遮罩层,使得`iframe`内容成为...

    ASP.Net电子商务网站后台模板

    &lt;li id="now19"&gt;生成文件管理" href="#" target="content3"&gt;生成文件管理&lt;/span&gt;&lt;/a&gt;&lt;/li&gt; &lt;li id="now1a"&gt;标签管理" href="#" target="content3"&gt;标签管理&lt;/span&gt;&lt;/a&gt;&lt;/li&gt; &lt;li id="now1b"&gt;模板管理" onclick=...

    多个iframe,其中一个的div能够处于最上层显示

    请注意,尽管这样可以解决大部分情况,但在某些情况下,浏览器的同源策略可能限制了跨 `iframe` 的交互。如果涉及到不同源的 `iframe`,可能需要采用其他方法,如使用 JavaScript 进行通信或调整 `iframe` 的大小和...

    可爱的iframe+div

    博主XXiongdi在他们的iteye博客中分享了如何结合使用iframe和div来解决实际问题或者创建特定效果。访问博文链接(https://xxiongdi.iteye.com/blog/407282)可以获取更多详细信息和实战经验。 在提供的文件列表中,...

    完全搞定iframe(框架)里的滚动条.doc

    ### 完全搞定iframe(框架)里的滚动条 #### 知识点概览 ...通过对不同场景下iframe滚动条问题的理解以及采用合理的CSS或JavaScript技术,可以有效地解决在A页面中加载B页面时出现的滚动条问题,提升用户体验。

    IE6下 Jquery EasyUI 弹出窗口层无法挡住select 组件 解决方案

    本文将详细探讨一个特定的问题,即在Internet Explorer 6(IE6)环境下,使用JQuery EasyUI时,弹出窗口(对话框)无法正确遮挡页面上的select组件,以及如何解决这一问题。 JQuery EasyUI是一个基于jQuery的UI库,...

Global site tag (gtag.js) - Google Analytics