这两天一直被ie下png背景图透明的问题所困扰。
以前遇到这种问题,
可是这次,我把处理png背景透明问题的各种方法如css法,js法,iepngfix.htc法都用过了。ie6和ie7下都不透明,而且ie6和ie7的背景还是不同的效果。本来应该透明的背景在ie6里是一篇灰色,在ie7下则是一片黑色。这也太奇怪啦。
正常来说,ie7和火狐一样能够支持透明,不支持透明的只是ie6而已,但这次ie7下怎么是一片黑色的效果呢?
我很费解啊。
想这个问题我想了2天。在第2天下午,我尝试着把要透明的那一段html、css以及js独立出来,看看到底是不是css或js互相冲突引起的。
将html、css和js独立出来以后,代码就很少啦,所以看着就比较清晰。我就一个个试啊试啊,暂时还是没找到原因所在。
只好硬着头皮继续测试。
我把jQuery里一个tooltip的效果由toggle改为slide或fade后,再一保存,刷新看一下。哇塞,ie7下的黑色大背景变透明鸟啊。
真是兴奋,原来问题出在这里。
我在页面里使用了jQuery的tooltip插件,然后是这样写的代码:
$(function(){
$(“#nav03″).tooltip({
tip: ‘#nav03Hover’,
offset:[85, 73],
effect:”toggle”
});
})
将effect里的toggle改为tooltip的其他效果后,ie7的黑色背景就没有了。
现在ie7就变得和火狐一样,透明png背景都能实现透明效果啦。
如果你也正在为透明png背景在ie7下显示为乌漆抹黑的一片,或许就是我描述的这种问题哦,那就赶紧试试我这方法吧。
13 Comments
我一般能用gif解决就尽量用gif,该死的ie
[回复]
aisinvon Reply:
九月 23rd, 2009 at 21:04
@zwwooooo, 关键是有些地方它必须用png透明。ie6真令人头痛
[回复]
Lazyyyyyy Reply:
五月 22nd, 2010 at 00:46
@zwwooooo, 没想到这里都遇到Z叔叔~
我是搜索CSS与JS样式的冲突问题而来到这里的~
因为不知道为什么我那个站调用jiazhis的浮动按钮样子有问题……
虽说这篇文章不是解决我那个问题的,不过也算是长见识了~
[回复]
我那logo以前也是那样,这次才改了下。
[回复]
aisinvon Reply:
九月 23rd, 2009 at 21:24
@phenix, 哎,兼容是个大麻烦啊
[回复]
一直都是用火狐!IE用的少!
[回复]
aisinvon Reply:
九月 23rd, 2009 at 22:46
@分享联盟, 我现在也是基本用火狐的
[回复]
呃,偶原来都是故意用的半透明png来欺负IE用户=v=
[回复]
aisinvon Reply:
九月 23rd, 2009 at 22:46
@lovee, O(∩_∩)O,还能这么搞
[回复]
lovee Reply:
九月 23rd, 2009 at 23:00
@aisinvon, 因为被很多IE Only的网站弄的很生气=_=||||||||||||||||
[回复]
aisinvon Reply:
九月 23rd, 2009 at 23:01
@lovee, 呵呵,那是彼此彼此啊
[回复]
这个问题到目前为止还没遇到过!先收着!
[回复]
aisinvon Reply:
九月 23rd, 2009 at 23:02
@kevin, 没遇到是好事啊,不然就头痛啦
[回复]
kevin Reply:
九月 24th, 2009 at 00:00
@aisinvon, 嗯,有时候从遇到至解决也是一种学习
[回复]
aisinvon Reply:
九月 24th, 2009 at 00:05
@kevin, 那是
[回复]
老问题了已经是,天杀的IE什么时候才能统一成8呀
[回复]
aisinvon Reply:
九月 24th, 2009 at 00:04
@sleepy, 是啊,啥时候是个头啊
[回复]
我不会头疼的。
[回复]
aisinvon Reply:
九月 24th, 2009 at 19:23
@太阳博客, 我会头疼啊,呵呵
[回复]
对这个问题接触的较少,呵呵
[回复]
aisinvon Reply:
九月 24th, 2009 at 19:23
@健康播报, 少碰到为妙哦
[回复]
这个问题很难解决的啊
[回复]
aisinvon Reply:
九月 24th, 2009 at 19:24
@卢松松, 是啊,没有一个完美的解决办法
[回复]
还在折腾IE啊,换Firefox吧
[回复]
aisinvon Reply:
九月 24th, 2009 at 19:24
@我想想, 我换firefox问题也解决不了啊,我换用户不换啊
[回复]
见识了,顺便研究一下呵呵
[回复]
解决了IE7解决不了IE6。。
还是gif吧,省点流量
[回复]
aisinvon Reply:
九月 24th, 2009 at 22:22
@A.shun, 我现在已经发现一种比较好的解决办法啦。过几天分享上来
[回复]
A.shun Reply:
九月 24th, 2009 at 23:02
@aisinvon, 那就等着你的大作了
[回复]
aisinvon Reply:
九月 24th, 2009 at 23:38
@A.shun,大作不敢当啊
[回复]
不是js和css冲突吧,是js里面重新定义了css的样式吧?
[回复]
aisinvon Reply:
九月 25th, 2009 at 19:54
@世纪之光, 不是冲突,也不是js定义了css,而是toggle的效果导致的
[回复]
One Trackback
[...] 关于ie6下png图片的透明问题,市面上有很多的解决方案,我在前面写过2篇相关文章(透明png在ie7显示为黑色背景的解决办法、关于ie6中使用css滤镜后链接无法点击的问题)主要有以下2中: [...]