透明png在ie7显示为黑色背景的解决办法
这两天一直被ie下png背景图透明的问题所困扰。
以前遇到这种问题,
写上一句css或在head部分链接上一段专门处理ie6 png背景图透明的js,一般问题都能解决。
可是这次,我把处理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下显示为乌漆抹黑的一片,或许就是我描述的这种问题哦,那就赶紧试试我这方法吧。