IE6下Png透明最佳解决方案DD_belatedPNG
发布时间:2013-09-11 15:32:19 作者:佚名 我要评论
曾经一度的采用滤镜的方法搞定这个问题,弊端是当有多个png图片的时候,这就造成了css的压力,得写多少css代码呀,也尝试过js,缺点是不支持CSS中backgrond-position与background-repeat
这个问题曾经困扰我许久许久……曾经一度的采用滤镜的方法搞定这个问题,但是这种方法有个弊端。就是当有多个png图片的时候,这就造成了css的压力,得写多少css代码呀。也尝试过js,但是这些方法都有一个缺点,就是不支持CSS中backgrond-position与background-repeat.是否有一种方法能解决全站的ie6下png透明问题呢。
搜遍谷歌,发现了一个最完美的解决方案:DD_belatedPNG(点解连接 查看官方).
原理
这个js插件使用了微软的VML语言进行绘制,而其他多数解决PNG问题的js插件用的是AlphaImageLoader滤镜.
使用方法
1.点击这里下载 DD_belatedPNG.js
2.在网页中引用,如下:
复制代码
代码如下:<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script> _fcksavedurl=""DD_belatedPNG.js"></script>"
<script>
/* EXAMPLE */
DD_belatedPNG.fix('.png_bg');
/* 将 .png_bg 改成你应用了透明PNG的CSS选择器 */
</script>
<![endif]-->
使用a:hover请留意
想要用透明PNG作为a:hover时的背景图片,,需要以”a:hover”来作为选择器
例:
复制代码
代码如下:<!--[if IE 6]>
<script type="text/javascript" src="js/DD_belatedPNG.js" ></script>
<script type="text/javascript"> DD_belatedPNG.fix('.png_bg,.box a:hover');
</script>
<![endif]-->
相关文章
- 与普通的蒙版效果不一样,需要有一个空白的地方显示页面上原有的动态内容,具体的实现思路如下,感兴趣的朋友可以参考下,希望对大家有所帮助2013-08-13
- 在某些情况下可能会需要背景半透明文字不透明这样的效果,实现起来并不复杂,通过滤镜便可做到,具体实现如下,感兴趣的朋友可以参考下,希望对大家有所帮助2013-08-05
- 图片透明在某些特殊的情况下还是比较实用的,下面是用滤镜写的图片透明代码,感兴趣的朋友可以参考下哈,希望对大家有所帮助2013-07-04
背景透明文字不透明的最佳方法兼容IE(以背景黑色透明度0.5为例)
本文以背景黑色,透明度0.5举例为大家详细介绍下关于背景透明,文字不透明的最佳方法同时兼容IE,具体实现如下,感兴趣的朋友可以参考下哈希望对大家有所帮助2013-07-03使用滤镜解决IE6下png图片不能透明(被渲染成默认色)的问题
IE6不支持透明,所有的透明部分,都被渲染成灰色或白色(不知道啥颜色,他自己的默认色)。这样看起来难看不说,圆角的功能荡然无存,下面与大家分享下使用滤镜解决此问题2013-06-20格式png24透明底 多种解决png24格式图片在ie6中透明问题
图片透明,锯齿问题是重构人员很头疼的问题,png24可以解决这些锯齿问题,但是ie6不支持png24透明,不过利用ie6的hack问题有两种解决的办法,感兴趣的朋友可以了解下哈2013-05-24- 想不想要自己的主页链接很炫呢,背景半透明的链接效果,空链接实现的链接效果,只需要定义一个特效式的CSS样式即可以实现,在需要实现的地方应用定义的CSS样式,也可以全站2013-02-27
- img加半透明背景实现原理:给li加上背景,li的大小就是图片的大小,在a:hover时候改变a的透明度,感兴趣的朋友可以了解下,希望本文可以帮助到你2013-01-13
最新评论