Des PNG transparents sous IE6 avec du CSS
13 nov

Voici une nouvelle méthode pour rendre les PNG transparents sous Internet Explorer 6 mais cette fois-ci uniquement dans une feuille CSS !
La méthode consiste à utiliser la propriété CSS de Microsoft expression. Celle-ci n'est bien sûr pas standard mais elle permet à Internet Explorer d'executer du pseudo-Javascript.
Voici donc le petit code :
* html img,
* html .png{
behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
this.src = "transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
);
}
Ce code va ainsi chercher toutes les images PNG et les remplacer par le filtre AlphaImageLoader de Microsoft. Et pour les PNG en background il suffit d'ajouter la classe CSS .png.
Malheureusement, le script ne fonctionne pas si le Javascript est désactivé.
Via Komodomedia.
Shemu.
- Catégorie
- Tutoriels XHTML/CSS
- Lien permanent
- #204
- Syndication
- RSS














