Problème Affichage Image PNG (Transparence)

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
guilhem_mdg
Lézard à collerette
Messages : 438
Inscription : 18 juin 2004, 09:13

Problème Affichage Image PNG (Transparence)

Message par guilhem_mdg »

Bonjour à tous,
Je viens de créer une image avec mon logiciel The Gimp mais voilà, la transparence ne s'affiche que dans FF et pas dans IE6.0. Cela est-il normal ?
Comment faire pour arranger ça ?
Merci de votre aide.
Cordialement.
Guilhem.
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

C'est normal, IE ne supporte pas la transparence PNG.
Quand tu enregistre, définit une couleur d'arrière-plan, c'est celle que IE utilisera. Voilà :wink:
guilhem_mdg
Lézard à collerette
Messages : 438
Inscription : 18 juin 2004, 09:13

Message par guilhem_mdg »

oui mais c'est étonnant car il supporte bien celle du GIF ... :roll:
Cordialement.
Guilhem.
jv2759
Tyrannosaurus Rex
Messages : 4161
Inscription : 12 févr. 2004, 14:29

Message par jv2759 »

Car ie n'as pas évoluer depuit un certain bout de temps et qu'il avait commencer à suporter le format png, mais comme microsoft à arreter de faire évoluer ie, cette gestion en est rester la...

Mais si tu attend encore un peux (quelque année) je crois quand achetant longstorme ie seras améliorer...
chBok
Iguane
Messages : 991
Inscription : 17 oct. 2003, 19:17

Message par chBok »

GIF était un format propriétaire, du coup, le format PNG est apparu offrant de meilleurs taux de compression, la transparence, plus de couleurs, etc.
IE n'a jamais fait d'effort pour ce format. Le rendu de PNG sous IE est plus que médiocre.
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Ce n'est pas pareil le GIF. Déjà ça date de la nuit des temps, le PNG est sorti en octobre 1996.
Ensuite en GIF on peux choisir quelle couleur sera transparente. Il n'y a qu'une couleur, et elle est transparente partout !
Le PNG permet de placer une information de transparence sépcifique sur chauque pixel (donc pas chaque couleur), et la transparence peut être partielle.

Conclusion, on ne peut pas comparer :wink:
piouPiouM
Gecko
Messages : 51
Inscription : 11 août 2003, 10:20

Message par piouPiouM »

calimo a écrit :C'est normal, IE ne supporte pas la transparence PNG.
IE ne supporte pas la transparence des png supérieurs à 8bits, mais gère la transparence des png 8bits ;)
Enfin, c'est pas terrible comme rendu en 8bits :?
Mais manque de bol je crois que Gimp ne fait que du 24bits donc...
Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.4; en-US; rv:1.9.0.4) Gecko/2008102920 Firefox/3.0.4
guilhem_mdg
Lézard à collerette
Messages : 438
Inscription : 18 juin 2004, 09:13

Message par guilhem_mdg »

Si j'ai bien compris faudrait que je fasse une transparence en 8 bits au lieu de 24 ?? :roll:
Mais c'est quoi exactement ce nombre de bits ?
Cordialement.
Guilhem.
jv2759
Tyrannosaurus Rex
Messages : 4161
Inscription : 12 févr. 2004, 14:29

Message par jv2759 »

je crois que c'est le nombre de bit maximum sur lequelle il peux indexer les couleur. Et le 8bits en fait c'est la même chose que gif...
piouPiouM
Gecko
Messages : 51
Inscription : 11 août 2003, 10:20

Message par piouPiouM »

jv2759 a écrit :je crois que c'est le nombre de bit maximum sur lequelle il peux indexer les couleur. Et le 8bits en fait c'est la même chose que gif...
Ouaip, 256 couleurs seulement :?
Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.4; en-US; rv:1.9.0.4) Gecko/2008102920 Firefox/3.0.4
nomade
Iguane
Messages : 985
Inscription : 03 sept. 2003, 04:15

Message par nomade »

Il existe des hacks pour rendre les png transparents sous IE. J'en avais trouvé un en javascript mais y avait toujours un problème : sous IE l'image s'affichait avec transparence mais on voyait aussi le cadre de l'image avec la petite croix en haut à gauche, comme quand il ne touve pas l'image source. Bref pas terrible..

Je l'ai pas retrouvé mais tu peux aller faire un tour ici (pas essayé) :
http://phoenity.com/newtedge/png_degradability/
http://www.mongus.net/pngInfo/
Invité

Message par Invité »

piouPiouM a écrit :
jv2759 a écrit :je crois que c'est le nombre de bit maximum sur lequelle il peux indexer les couleur. Et le 8bits en fait c'est la même chose que gif...
Ouaip, 256 couleurs seulement :?
Oui que 256 couleurs, mais si tu dois enregistrer un fichiers comme ça, vaut mieux l'enregistrer en png tout de meme qu'en gif


Avant hier je m'étais pris la tête sur cette histoire de 8 bit/24 bit, et en regardant le logo de OpenWeb miracle(comme quoi il aide vraiment pour tous) :lol:

et comme mon header n'a qu'un degradé de rouge le 8 bits convenait parfaitement.



Sinon Guilhem le nombre de bit définit le nombre de couleurs en gros, certain expliqueront bien mieux
Ave Cox
Salamandre
Messages : 27
Inscription : 13 févr. 2004, 00:44

Message par Ave Cox »

il existe ceci : (j'ai pas testé donc jsais pas vous dire ce qu'il en est)

http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html

ou il y a ca :

tu inclus ca dans le <head></head> de ta page :

Code : Tout sélectionner

<!--[if gte IE 5.5000]>
  <script type="text/javascript" src="pngfix.js"></script>
<![endif]-->
avec le fichier pngfix.js qui est le suivant :

Code : Tout sélectionner

// 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) ? "alt='" + img.title + "' " : "alt='" + 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);
qui fonctionne bien (mais j'ai pas testé énormément, juste 2-3 images donc faut essayer pour confirmer)

plus d'infos : http://homepage.ntlworld.com/bobosola
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Tout ça pour faire croire aux utilisateurs d'IE que leur navigateur est potable :?
Et en plus, ce sont de personnes qui ont écrit ça tout seul, et MS n'est pas capable de l'intégrer à son navigateur ? Incroyable non ?
guilhem_mdg
Lézard à collerette
Messages : 438
Inscription : 18 juin 2004, 09:13

Message par guilhem_mdg »

Je suis désolé car je viens de tester tout vos liens et aucun ne me donne un résultat satisfaisant. Le résultat est excellent sous Mozilla mais très moyen sous IE...
Tant pis, je pensais que Microsoft était assez intelligent pour supporter la transparence des images :?
Merci en tout cas de vos réponses... Et vive Mozilla !!!!!
Cordialement.
Guilhem.
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 8 invités