Is there a JavaScript PNG fix for IE6 that allows CSS background positioning?

冷暖自知 提交于 2019-12-03 02:57:12

Yes. Convert your images to use indexed pallets (png256). You can support transparency (just like gif), but not an alpha channel.

You can do this using Irfanview and the pngout plugin, pngquant or pngnq.

The YUI performance team also did a great presentation that covers this an many other image optimization concepts.

This is a new technique that has popped up in the last month or so. From the page:

In this script image tags are supported, both with and without a blank spacer GIF, and background image PNGs may be positioned, as well as repeated, even if they're smaller than the content element they're in.

When the background is static I use TweakPNG to change the Background Color chunk in the PNG to the correct color (instead of the default gray color). Any regular browser will ignore this because the alpha channel overrules it, but IE6 and lower will use that color instead of the alpha channel.

This means we have transparency in IE7+ while degrading nicely in IE6 and lower. And all css positioning and repeating are possible (because there are no hacks!).

DD_belatedPNG.js works very well

You can actually use pure CSS to get positioned background images with alpha transparency in IE6 by taking advantage of IE6's alpha filters and the CSS clip property. Julien Lecomte describes the technique on his blog.

Note that this technique does result in a performance hit for each use of an alpha filter.

IE PNG Fix v2.0 has support for full alpha+position/repeat.

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!