Images png sous Internet Explorer
Le png, bien que plus performant que le gif, et est peu ou mal supporté par certains navigateurs dont celui de microsoft, Internet Explorer.
Il existe cependant une astuce permettant IE, à partir de la version 5.5, d’afficher correctement la transparence des png .
Il convient d’insérer dans les balises head de vote page html le code suivant:
<!–[if gte IE 5.5000]>
<script type= »text/javascript » src= »pngfix.js »></script>
<![endif]–>
Puis à la racine de votre serveur (ou ailleurs), mettez le fichier pngfix.js contenant le code javascript suivant:
// Correctly handle PNG transparency in Win IE 5.5 or higher.
// http://homepage.ntlworld.com/bobosola. Updated 02-March-2004
function correctPNG()
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == « PNG »)
{
var imgID = (img.id) ? « id=’ » + img.id + « ‘ « : « »
var imgClass = (img.className) ? « class=’ » + img.className + « ‘ « : « »
var imgTitle = (img.title) ? « title=’ » + img.title + « ‘ « : « title=’ » + img.alt + « ‘ «
var imgStyle = « display:inline-block; » + img.style.cssText
if (img.align == « left ») imgStyle = « float:left; » + imgStyle
if (img.align == « right ») imgStyle = « float:right; » + imgStyle
if (img.parentElement.href) imgStyle = « cursor:hand; » + imgStyle
var strNewHTML = « <span « + imgID + imgClass + imgTitle
+ » style=\ »« + « width: » + img.width + « px; height: » + img.height + « px; » + imgStyle + « ; »
+ « filter:progid:DXImageTransform.Microsoft.AlphaImageLoader »
+ « (src=\’« + img.src + « \’, sizingMethod=’scale’);\ »></span> »
img.outerHTML = strNewHTML
i = i-1
}
}
}
window.attachEvent(« onload », correctPNG);
Télécharger le fichier pngfix.js pngfix.js
Les png transparents devraient normalement s’afficher correctement sous IE. Pour plus de détails vous pouvez vous référer à la page suivante: http://homepage.ntlworld.com/bobosola/pngtestfixed_JS_inc_file.htm
Loading ...
3 Responses to "Images png sous Internet Explorer"
Il y a aussi l’excellent script de Dean Edwards : http://code.google.com/p/ie7-js/ qui en plus de gérer la transparence des png, améliore la compatibilité CSS de IE.
Merci pour cette excellente remarque.
Voici une autre référence intéressante : http://developers.slashdot.org/story/10/07/17/1645207/Adding-CSS3-Support-To-IE-6-7-and-8-With-CSS3-Pie