让IE6支持png半透明图片(支持背景平铺、定位)
2009-01-09 16:55
369 查看
以前发过一篇文章是说PNG透明问题修正,是使用一段JS来实现各个浏览器对png透明和半透明的支持(主要是ie6),但那种方法不支持背景平铺,挺不方便的,那么,这次就介绍一个完美支持png透明和半透明的方法----IE PNG Fix。这个方法不是每个版本都支持背景平铺和定位的,得是v2.0 Alpha 3版本才行,请自行点击前面的链接进行下载试用。
下面看一下演示:http://www.zeroz.cn/blog/wp-content/uploads/2008/12/iepngfix/
这是专门针对ie6做的演示,所有使用了if条件注释的方法。
这里简单说一下使用方法和注意事项:
把 iepngfix.htc 和 blank.gif 复制到网站相应的目录下(目录由自己决定)
然后要在页面的头部信息中调用 iepngfix.htc 文件,像这样:
这里的 img 和 div 是你想要应用透明效果的元素,同样,你可以这样写:
到这里要注意两个文件的路径,一个是我们引用的 iepngfix.htc 文件,另一个是 iepngfix.htc 文件中 blank.gif 的路径,要根据你自己网站的目录结构来调整。
如果想使用背景平铺和定位的效果,以前的步骤做完之后,我们还要再引用 iepngfix_tilebg.js 这个js,才能使png图片在ie6中平铺时实现透明效果,像下面这样:
Done
注:可以使用if条件注释语句,使这些文件只在ie6激活,以便在其他浏览器下加快加载速度。关于if条件注释语句的使用方法,可以看这里。
下面看一下演示:http://www.zeroz.cn/blog/wp-content/uploads/2008/12/iepngfix/
这是专门针对ie6做的演示,所有使用了if条件注释的方法。
这里简单说一下使用方法和注意事项:
把 iepngfix.htc 和 blank.gif 复制到网站相应的目录下(目录由自己决定)
然后要在页面的头部信息中调用 iepngfix.htc 文件,像这样:
<style type="text/css"> img, div{behavior:url(iepngfix.htc);} </style>
这里的 img 和 div 是你想要应用透明效果的元素,同样,你可以这样写:
<style type="text/css"> img, div, a, input{behavior:url(iepngfix.htc);} </style>
到这里要注意两个文件的路径,一个是我们引用的 iepngfix.htc 文件,另一个是 iepngfix.htc 文件中 blank.gif 的路径,要根据你自己网站的目录结构来调整。
如果想使用背景平铺和定位的效果,以前的步骤做完之后,我们还要再引用 iepngfix_tilebg.js 这个js,才能使png图片在ie6中平铺时实现透明效果,像下面这样:
<script type="text/javascript" src="iepngfix_tilebg.js"></script>
Done
注:可以使用if条件注释语句,使这些文件只在ie6激活,以便在其他浏览器下加快加载速度。关于if条件注释语句的使用方法,可以看这里。
相关文章推荐
- 解决IE6下PNG透明问题,支持平铺背景图片
- 让ie6支持png背景透明图片
- [Javascript] 解决 IE6 中 png 图片背景不支持透明效果的问题
- IE6不支持透明背景png图片
- 完美解决ie6不支持png 透明图片 和标签背景的问题
- 使用DD_belatedPNG让IE6支持PNG透明图片 及IE6下背景图闪烁问题的解决方法
- JQuery解决IE6不支持透明png图片、png背景
- IE6支持PNG24图片背景透明
- IE6下的png透明图片的背景定位
- ie6 firfox 支持PNG背景半透明css代码详解
- 完美解决IE6不支持PNG透明和背景定位
- 老外写的支持png图片的透明,背景定位
- 解决PNG图片在IE6下背景不透明的问题让IE6支持PNG透明背景
- css 半透明 让IE6支持png图片半透明解决方法
- IE6支持png半透明图片
- IE6不支持PNG透明图片的解决方案
- 使用DD_belatedPNG让IE6支持PNG透明图片
- CSS解决IE6下PNG图片背景不透明的问题
- ie6兼容png图片以及png背景图片
- 让IE6显示透明PNG背景图片