想特别说明一下,IE6与生俱来就支持png8的索引色透明度,但不支持png的 alpha 透明度。而我们一直要解决的是让IE6支持PNG的
alpha 透明度。下面我收集整理了4种方法,但都是以滤镜、Js、css
等作为基础模拟还原效果,虽然没有真正的解决alpha透明度问题,但也总算解决了燃眉之急。
IE6支持png8透明:
IE6与生俱来就支持png8的索引色透明度,但不支持png或8位以上的 alpha 透明度。而对于非动画的GIF建议你使用PNG8,因为体积会更小。
测试实例:http://blog.gulu77.com/demo/200809/test_IE6png8/
1、AlphaImageLoader 筛选器
使用简介:在每个标签样式中插入:
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’image.png’, sizingMethod=’scale’)
官方原文:http://support.microsoft.com/kb/294714/zh-cn go
测试实例:http://blog.gulu77.com/demo/200809/test_AlphaImageLoader/
2、PNG Transparency in IE
使用简介:相对来说比较简洁,使用一段包含滤镜的JavaScript 就可以模拟图片或背景 PNG alpha 透明度。
官方原文:http://codingforums.com/archive/index.php?t-80555.html go
测试实例:http://blog.gulu77.com/demo/200809/test_PNGTransparncyinIE/
3、IE PNG Fix v1.0 / 2.0 Alpha 2
使用简介:页面标签使用behavior:url(”iepngfix.htc”);来调用外部包含js、css的iepngfix.htc文件來修正PNG alpha 透明度。
官方原文:http://www.twinhelix.com/css/iepngfix/ go
测试实例:http://blog.gulu77.com/demo/200809/test_iepngfix/
4、IE7/IE8 JavaScript library
使用简介:ie7/ie8-js是一个解决IE与W3C标准的冲突的JS库,使微软的IE的行为像一个Web标准兼容的浏览器,支持更多的W3C标准。
官方原文:http://code.google.com/p/ie7-js/ go
测试实例:http://blog.gulu77.com/demo/200809/test_ie7-js/
全部实例打包下载:http://blog.gulu77.com/demo/200809/test_png.rar
5、还发现一个方法:belatedPNG 。具体方法是将下面的代码插到<head></head>之间:
<!–[if IE 6]>
<script src="DD_belatedPNG_0.0.7a-min.js"></script>
<script>
DD_belatedPNG.fix(””*””);
</script>
<![endif]–>
此方法能同时解决图片和背景问题。
所用到的 js 文件可以点击这里
下载(5.41 kb)。
分享到:
相关推荐
以下是关于"IE6下PNG背景透明的方法"的详细解释: 1. **CSS滤镜法**:这是最基础的解决方式,利用CSS中的`filter`属性。对于PNG8格式的图片,可以使用`filter:progid:DXImageTransform.Microsoft.AlphaImageLoader...
以上就是实现IE6下PNG图片透明的几种常见方法。虽然现代浏览器已经不再存在这些问题,但考虑到仍有一部分用户可能还在使用IE6,这些技术对于开发兼容性良好的网站仍然是必要的。在实际应用中,结合条件注释、CSS滤镜...
处理完IE6下的PNG透明问题后,可能会遇到一些新的挑战,例如性能影响、图片质量下降或是与其它CSS样式的冲突。因此,在应用解决方案时,应进行充分的测试,确保在保持视觉效果的同时,不影响网站的整体性能和用户...
要实现IE6下的PNG透明,通常采用以下几种JavaScript解决方案: 1. **DD_belatedPNG**:这是一个广泛使用的JavaScript库,由Dean Edwards开发。它通过模拟PNG Alpha透明效果,使IE6能够正确显示PNG图片。核心原理是...
PNG图片支持24位颜色以及8位的alpha通道,也就是所谓的PNG-24格式,它允许图片部分像素具有不同程度的透明。然而,IE6并不支持这种透明效果,它只支持PNG-8格式,而PNG-8仅能实现二值透明(完全透明或完全不透明)。...
以下是对标题和描述中提到的七种解决IE6下PNG背景透明问题的方法的详细解释: 1. CSS Hack 使用CSS的特定浏览器识别语法,例如下划线`_`前缀,来针对IE6设置不同的背景图像。例如: ```css .pngImg { ...
4. **HTML5 doctype**:使用HTML5的doctype可以强制IE6进入"Quirks Mode",在这种模式下,PNG透明问题可能会得到缓解,但这不是最佳实践,因为它会导致其他兼容性问题。 以上就是关于“IE 6 PNG透明通道”的知识点...
IE6只能正确处理PNG8格式的简单透明,即alpha透明,而对于PNG24格式的半透明(也称为阿尔法通道透明)则无法正常显示。这使得在设计网页时,如果希望在IE6下实现半透明效果,就需要采取一些额外的技巧。 1. 使用CSS...
PNG(Portable Network Graphics)是一种常见的图像格式,它支持24位真彩色以及Alpha通道透明度,但在IE6中,对于带有Alpha透明度的PNG-24图像,浏览器默认无法正确显示透明效果。这个问题导致了“IE6png透明JS”这...
然而,在IE6及以下版本,由于浏览器内核的限制,PNG-24的透明度(阿尔法通道)会被忽略,导致图片背景变为不透明,严重影响了网页设计的视觉效果。 处理IE浏览器下PNG图片无法透明的方法有多种: 1. **CSS滤镜方法...
PNG(Portable Network Graphics)是一种支持透明度的图像格式,但在IE6中,它无法正确显示带有alpha透明通道的PNG-24图像,导致图片出现半透明部分变成全黑或者背景颜色无法透过,这被称为“PNG透明问题”。...
本文将深入探讨IE6支持PNG透明图片的方法,以便在使用这种浏览器时仍能实现理想的网页效果。 首先,理解问题的核心:IE6对于PNG8格式的图片可以处理简单的色调透明,但对于PNG24格式的图片则无法正确显示Alpha通道...
标题中的“IE6_PNG透明终极解决办法”指的是在Internet Explorer 6(简称IE6)浏览器中处理PNG图片透明度的问题。PNG格式的图片支持Alpha透明通道,允许半透明效果,但在IE6这个古老的浏览器中,对PNG8和PNG24格式的...
为了解决IE6下的PNG透明图片问题,开发者们提出了几种解决方案: 1. **CSS滤镜方法**:利用IE6特有的CSS滤镜属性,如`filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png', sizingMethod='...
特别是PNG24,它包含了24位颜色和一个alpha通道,用于实现半透明效果,但IE6只能处理没有alpha通道的PNG8格式。因此,当24位PNG图片被用作背景时,IE6会默认将其背景设为不透明。 解决这个问题有几种常见方法: 1....
- IE6_PNG_repeat(平铺):对于需要平铺的背景图片,需要特别处理,确保平铺后的透明效果在IE6下也能正常工作。这通常需要结合JavaScript库的功能,如DD_belatedPNG.js提供的方法,来实现平铺和透明的兼容。 4. ...
然而,IE6及更早版本并不完全支持PNG-8和PNG-24的阿尔法通道,导致在这些浏览器中显示PNG图片时可能会出现不透明或错误的透明效果。 为了在IE中实现PNG图片的透明,我们可以采用CSS滤镜(Filter)技术。滤镜是IE...
这个库通过JavaScript代码来模拟PNG的透明效果,使得PNG-24格式图片在IE6下也能显示透明效果。具体来说,"DD_belatedPNG"库通过添加额外的元素和CSS样式,将PNG图片的透明部分替换为一个背景颜色,然后调整这些元素...
4. **绘制图像**:在控件的OnPaint事件中,使用Graphics对象的DrawImage方法,指定源图像、目标位置和绘图区域,同时设置Alpha通道的透明度。 5. **处理鼠标和键盘事件**:为了让控件可以响应用户的交互,你需要添加...
PNG是一种无损压缩的图像格式,支持透明度(Alpha通道)。在其他现代浏览器中,如Firefox、Chrome、Safari和Opera,PNG的透明特性可以完美呈现。但在IE6及以下版本,由于其内核的限制,只支持8位PNG(不包含Alpha...