PNG semi transparent sous IE 6
Quel monteur HTML n'a jamais eut cette problématique ? devoir intégrer un div ayant un background transparent qui fonctionne sous IE 5.5 minimum ! Heureusement, une solution existe, et elle fonctionne quasi parfaitement. Elle n'utilise pas le pngfix qui bave bien trop souvent, et sons paramétrage est simple comme bonjour.
Il suffit d'aller sur la page http://www.twinhelix.com/css/iepngfix/ où deux version existent. Pour la peine, j'utilise la version beta 2.0 qui se trouve ici: http://www.twinhelix.com/test/iepngfix.zip. Il suffit de dézipper le contenu et de placer iepngfix.htc et blank.gif dans un répertoire attitré. Pour vous simplifier la vie, mettez les deux fichiers au même endroit.
Reste à ajouter une seule et unique ligne dans votre CSS, par exemple pour que le fix gère les images (png) et les div (ayant un background png semi transparent):
img, div { behavior: url(répertoire/où/se/trouve/iepngfix.htc) }
Et voilà ! C'est tout... Maintenant, imaginons une feuille de style qui utilise ce code:
body {
/*fond.jpg est une image normal*/
background-image: url(images/fond.jpg);
}
div.semitransp {
/*Cette classe utilise un png semi
transparent en fond, il faut donc voir le fond.jpg
par transparence... le fix va le gérer*/
background-image: url(images/semtransp.png);
}
Par miracle, ça fonctionne. Et c'est très joli, à vous de l'utiliser pour vous faire (enfin!) des designs qui puissent utiliser des png sans vous poser la question "arrggg mais comment je vais gérer ça sous IE 6 ???"
Pas de commentaire pour le moment
Trackbacks
Pour ajouter un trackback (retrolien) sur ce ticket, utilisez cette adresse: http://www.metal3d.org/index.php/trackback/default/tb?id=blog%2F148
