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

最新推荐文章于 2024-09-15 10:24:49 发布

twinkleliang

最新推荐文章于 2024-09-15 10:24:49 发布

阅读量162

点赞数 1

文章标签： iframe html ie

本文链接：https://blog.csdn.net/twinkleliang/article/details/83980287

版权

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]-->]]>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

twinkleliang

关注关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

导航栏下拉框被iframe遮住无法显示的解决办法，同时不需要相同层级就能解决

不见来去的博客

10-12

3452

看了一大堆，下拉框被遮住的解决办法，发现要用z-index属性解决的话，都是需要一个前提的，那就是需要相同层级定位，具体情况参考这里。重点：但是有些时候是无法满足相同层级定位这个前提的条件的，我就被这个问题困扰过，百般尝试解决，终于灵光一闪解决了，原来那么简单，笑哭。解决方法：首先把遮住你下拉框的iframe的css的样式改为相对于窗口定位position:fixed;，然后在导航栏和ifr...

js-iframe遮挡select问题

weixin_30379911的博客

11-20

226

以下都是对ie6：一直都用iframe来遮挡select，以前一直没有注意到：在使用iframe遮挡select时，select被完全挡住，根本看不见（就算将iframe的opacity=0）针对这个问题网上有几个解决方法： 1. 给select外边包一层iframe 如果select过多，似乎这个性能优点问题。 2. 给操作dom节点包一层ifra...

参与评论您还未登录，请先登录后发表或查看评论

ie6下select挡住div、li解决办法

jsz04801的博客

12-08

545

ie6真的是够了~~使用dialog，莫名其妙的后面的select标签吐出来了，在网上找到z-index属性来指定优先级，然并卵ie6不支持这个标签，接着找吧!后来看到大神说使用iframe来挡住它，div不能遮住，但是frame可以遮挡，于是试了下，效果可以使用Iframe解决IE6下Div/UL/Li 挡不住Select box 的3法 1）基础套路：一般在需要的DIV上加入这

IE6、7各种问题及解决方案

hfdy_yu的博客

11-16

302

IE6、7各种问题及解决方案 1.

ie9下在iframe中使用document.selection.createRange().text获取的值为空的解决办法

鲁小班的博客

09-29

1157

最近公司之前的用iframe框架写的一个老系统要求实现一个身份证上传并且预览的需求，兼容到ie9；由于这个项目保密，所以我这边仿照写了个demo 效果图源码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> ...

css/div/兼容性及常见bug

qq_45271323的博客

05-13

1720

清除浮动的几种方法首先，为什么会有清除浮动这一说法？当有一个父元素里面包含一个子元素或者多个子元素时，给子元素设置浮动，那么会父元素的高度就为0啦，也就是我么常说的高度塌陷。如何解决？给父元素添加height 原理：如果父元素没有定义高度，那么父元素的高度完全由子元素撑开，给他定义了高度，就解决了父元素无法自动获取到高度的问题。在标签结尾处加空标签，给空标签添加clear:both 原理：添加了空标签，利用CSS提高的clear:both清除浮动，让父级元素能自动获取到高度。**优点：*

H5/C3 知识点总结(持续更新）

qq_52403971的博客

08-31

777

（H5+CSS3一些非常基础的基础面试题） 1 块级元素： div、p、h1~h6、ul/ol-li、特点：独占一行宽度100% 如果没有父元素，宽度相对视口区而言，如有父元素，相对父元素而言。高度则有内部元素决定。可有css直接设置宽高块级可嵌套行内，行内嵌套行内，不可以嵌套跨级 2 行内元素：（img 、input特殊行内，可以直接设置宽高） a、 img 、 span、 strong 、 em 、i 特点：与各种元素同一行宽高由自身元素内容化决定行内无法嵌套块级，可以嵌套行内 3 块级和

ie6,ie7,ie8,ie9 css bug兼容解决记录

daiquan_xu的专栏

01-13

655

select { background-color:red\0; /* ie 8/9*/ background-color:blue\9\0; /* ie 9*/ *background-color:#dddd00; /* ie 7*/ _background-color:#CDCDCD; /* ie 6*/ } 断断续续的在开发过程中收集了好多的bug以及其解决的办法，都在这个文章里面

IE下select width的解决方式

The Program World

05-25

182

开发过程中遇到这么一个问题有一个<select></select>的选择框，里面有个option的值很长大约128个字节，那么如果我不指定select的width时候，这个框就会很长，但是如果我限制了width那么这个option又显示不全，这个BUG仅仅会在IE中出现，如何解决呢，其实可以把select的下拉框用一个层覆盖掉，那个层会显示完整的数据，而select的wi...

Go实战--golang中使用WebSocket实时聊天室(gorilla/websocket、nkovacs/go-socket.io)