• Accueil
  • Portfolio
  • Contact
Loading... Loading ...

WebCssDesign

  • Flux RSS
  • RSS par Email

Images png sous Internet Explorer

par Admin le lundi 11 février 2008 à 09:50

png et transparenceLe 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

Popularité : 13% [?]

Catégories: Ajax
Tags: Css, design, javascript

Articles correspondants

    Pas d' articles correspondants

2 Réponses to “Images png sous Internet Explorer”

  1. Steph on 11 fév 2008 at 11:27

    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.

  2. Admin on 11 fév 2008 at 23:40

    Merci pour cette excellente remarque.

Laisser un commentaire

Vous pouvez utiliser ces balises XHTML tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>

« Slider de news Mootools Diaporama cross-fade Scriptaculous »
  • Récents
  • Populaires
  • Catégories
  • 8 astuces Css
  • Ajax jQuery, 10 tutoriels à voir
  • Formulaire Css sans table
  • antispam css simple et efficace
  • diaporamas, galerie et carrousel flash gratuits
  • Des SMS gratuits dans le monde entier
  • jQuery virtual tour gratuit
  • Diaporama Flash carousel gratuit
  • Diaporama cross-fade Scriptaculous
  • Carrousel Flash Gratuit
  • Mediabox, un lightbox polyvalent gratuit
  • Carrousel Ajax façon apple
  • jQuery animation avec effet slide
  • Slideshow Mootools
  • Actualité Informatique
  • Ajax
  • Css
  • Flash
  • Graphisme
  • Outils Web
  • PHP
  • video

Calendrier

mai 2008
L Ma Me J V S D
« avr «-»  
 1234
567891011
12131415161718
19202122232425
262728293031  

Faites un don

Tags

Ajax animation Apple bannière flash carrousel ajax clone youtube Css design designer films gratuit firefox firefox beta 3 Flash google adsense gratuit gratuits HTML 4 HTML 5 icon icones icons javascript jquery linux mac book air mediabox mediaplayer gratuit miniatures Modalbox overflow pdf pdflib php4 php5 plugin progress bar publicité slide slideshow sql star office 8 suite bureautique video W3C xml

Mes réalisations

  • ProvenceGuide.com
  • Infos-Provence.com
  • Videos2Sport.com
  • Opichoun.com
  • Urbalis
  • L'Oustau de la Font
  • La Paillote
  • L'Olivier
  • Le Sévan
  • Le Village Provençal
  • Aix Provence
  • Traiteur Rastello
  • Forbin de Janson
  • Vignobles Saint Médié
  • Challenge de la covivialité
  • Domaine de la Grange neuve
  • Abbaye Saint Eusèbe
  • Mr-Bricolage Pertuis
  • Provence and Riviera
  • PlanetWeb-Provence
  • LesFleurons-Apt
  • ProvenceWeb.mobi
  • MonSportGagnant.com
  • DesigndeStyle.com
  • Ecolo-News.com

Blogoliste

  • RecettesdesChefs.fr
  • Bonsplans-Web.com
  • DanceTecktonik
  • Lesconneriesdunet
  • Recettes de Cuisine
  • Lalumieredesfees.fr
  • SBnet.fr

Affiliation

affilinet One.com

 

Copyright © 2008 WebCssDesign | Accueil | Portfolio | Contact | MonSportGagnant.com | ProvenceWeb.mobi | Videos2Sport.com