Je suis d'accord avec toi, je suis aussi pour le PNG. Toutefois, j'ai un script pour toi les faire fonctionner les images PNG :
HTML :
<img style="behavior:url('script/pngbehavior.htc');" ... />
pngbehaviour.htc :
<public:component lightWeight="true">
<public:attach event="onpropertychange" onevent="propertyChanged()" />
<script>
var supported = /MSIE ((5\.5)|[6789])/.test(navigator.userAgent) &&
navigator.platform == "Win32";
// supported = false;
var realSrc;
var blankSrc = "images/blank.gif";
if(supported)
{
fixImage()
}
else
{
// alert(element.src.substring(element.src.length - 3,element.src.length));
if (element.src.substring(element.src.length - 3,element.src.length) == "png")
element.src = element.src.substring(0, element.src.length - 4) + '.gif'
}
function propertyChanged() {
if (!supported) return;
var pName = event.propertyName;
if (pName != "src") return;
// if not set to blank
if (!new RegExp(blankSrc).test(src))
fixImage();
};
function fixImage() {
// get src
var src = element.src;
// check for real change
if (src == realSrc && /\.png$/i.test(src)) {
element.src = blankSrc;
return;
}
if ( ! new RegExp(blankSrc).test(src)) {
// backup old src
realSrc = src;
}
// test for png
if (/\.png$/i.test(realSrc)) {
// set blank image
element.src = blankSrc;
// set filter
element.runtimeStyle.filter = "progid:DXImageTransform.Microsoft." +
"AlphaImageLoader(src='" + src + "',sizingMethod='scale')";
}
else {
// remove filter
element.runtimeStyle.filter = "";
}
}
</script>
</public:component>
Mais ce n'est pas géré par le CSS, ce que je souhaitais.
De plus, je cherchais à rendre une partie transparente d'un background et le backgroud étant défini dans le CSS, je n'ai pas trouvé de solution pour ce cas de figure.