解决IE下iframe默认有白色背景的bug
2013-08-21 10:17
363 查看
又是一个IE莫名其妙的bug:做了一个弹出层,层里面是一张透明图片,IE下的iframe默认会有一个白色的背景,所以当iframe的外围背景并不是白色的时候,这个iframe就会显得非常的“与众不同”。
这个背景是iframe本身的,不是iframe内的html元素的,所以,只对iframe进行相关设置就能去掉这个背景。
iframe有一个并不常用的属性:allowTransparency,意思是是否允许透明——蛋疼的是IE下好像默认是false,很多大网站的iframe上也没有加上这一条,所以这讨厌的白色背景经常会看到。
现在对iframe如下设置:<iframe allowTransparency="true" />(观影团这个用过,比较管事)
现在允许透明了,那是不是就搞定了呢?为了保险起见,还是手动设置一下iframe的背景透明吧。CSS如下:
iframe{background: transparent;}
至此,问题就已经解决了。但还有一些特殊情况:有时候iframe不是HTML中本身写的,是用Javascript加载进来的,这时虽然以上的CSS可以生效,但却没法给iframe本身加上allowTransparency属性了,这时候怎么办呢?
迫不得已,只有用JS了。
window.onload = function(){
var ifra=document.getElementsByTagName('IFRAME');
for(var i=0,l=ifra.length;i<l;i++) {
ifra[i].setAttribute('allowTransparency','true');
}
}
用javascript中的setAttribute方法来设置iframe的allowTransparency,以上代码没什么说的,但请放入只针对IE的注释中,因为这代码对firefox,chrome之流是不必要的。
这个背景是iframe本身的,不是iframe内的html元素的,所以,只对iframe进行相关设置就能去掉这个背景。
iframe有一个并不常用的属性:allowTransparency,意思是是否允许透明——蛋疼的是IE下好像默认是false,很多大网站的iframe上也没有加上这一条,所以这讨厌的白色背景经常会看到。
现在对iframe如下设置:<iframe allowTransparency="true" />(观影团这个用过,比较管事)
现在允许透明了,那是不是就搞定了呢?为了保险起见,还是手动设置一下iframe的背景透明吧。CSS如下:
iframe{background: transparent;}
至此,问题就已经解决了。但还有一些特殊情况:有时候iframe不是HTML中本身写的,是用Javascript加载进来的,这时虽然以上的CSS可以生效,但却没法给iframe本身加上allowTransparency属性了,这时候怎么办呢?
迫不得已,只有用JS了。
window.onload = function(){
var ifra=document.getElementsByTagName('IFRAME');
for(var i=0,l=ifra.length;i<l;i++) {
ifra[i].setAttribute('allowTransparency','true');
}
}
用javascript中的setAttribute方法来设置iframe的allowTransparency,以上代码没什么说的,但请放入只针对IE的注释中,因为这代码对firefox,chrome之流是不必要的。
相关文章推荐
- iframe在IE下将白色背景设为透明色
- 解决IE下CSS背景图片闪烁的Bug
- 解决ie8下的iframe背景不透明为白色的问题
- [转]解决IE下CSS背景图片闪烁的Bug
- iframe在IE下默认背景去除
- 解决浏览器窗口缩小出现白色背景的bug
- 解决IE下CSS背景图片闪烁的Bug
- IE下,fieldset背景溢出BUG的解决
- ie下 iframe在页面中显示白色背景 如何去掉的问题
- 解决IE下CSS背景图片闪烁的Bug
- iframe 背景设透明 国内某浏览器 为白色解决办法
- 解决IE6下默认不缓存背景图片的bug
- 解决IE下CSS背景图片闪烁的Bug
- 解决IE下CSS背景图片闪烁的Bug
- iframe在IE下出现进度条不完整的解决方法
- 解决IE6默认不缓存背景图片的
- [Bug] 解决透明 Activity 在 Android 6.0 背景不透明
- 缩小窗口时CSS背景图出现右侧空白BUG的解决方法
- iframe的onload在Chrome/Opera中执行两次Bug的解决方法
- IE下常用BUG解决办法