Espace-Temps 6
http://et6.free.fr/

Vos PNGs enfin transparents sous Inernet Explorer ^^
http://et6.free.fr/viewtopic.php?f=19&t=366
Page 1 sur 1

Auteur :  Dioxaz [ Ven 04 Fév 2005 23:20:32 ]
Sujet du message :  Vos PNGs enfin transparents sous Inernet Explorer ^^

Hmm, c'est quoi, un "PNG behaviour" ?

Et ben, c'est quelquechose qui force Internet Explorer à afficher les PNG transparents (avec couche alpha) réellement transparents.

Bon, on a bien eu droit aux PNG behaviour de WebFX, à celui de Mongus ... mais bon, avec eux, il fallait obligatoirement une image de superposition (un 'trasnparent.gif' ou autre image GIF/PNG-8 de 1 x 1 pixel trasnparent) et préciser les dimensions de l'image d'origine, sous peine de voir l'image disparaître ou voir le hack ne pas marcher correcement (croix rouge superposé sur l'original).

Avec, IE7, c'était différent... plus besoin de préciser les dimensions, mais toujours le besoin du GIF 1 x 1 pixels transparent. Je l'ai même testé sur le forum... mais comme IE7 fait plein d'autres choses en parallèle, ça ralentissait le forum...

Et il y en a un qui est beaucoup moins connu... et qui est tout aussi efficace, sinon plus !
Vous pouvez trouver ce hack ici :
http://homepage.ntlworld.com/bobosola/pnghowto.htm

Il vous suffira d'ajouter le fichier 'pngfix.js' qui vous est proposé sur la page en question à la racine de votre espace web. Ensuite, ajoutez le code suivant dans la rubrique <head> de votre page web :

<!--[if gte IE 5.5000]>
<script type="text/javascript" src="pngfix.js"></script>
<![endif]-->

Voilà. Maintenant, mettez-y un PNG alpha-transparent sur cette page et vlan !! Il sera transparent. Par contre, plus de possiblité pour télécharger l'image avec un clic droit. Par contre, le hack n'aura aucun effet sur les autres navigateurs (ce qui est un plus !).

C'est en fait celui-ci que j'ai installé sur ET6 (en le modifiant un poil).
Si vous voulez qu'un PNG alpha-transparent soit transparent sous IE (avatar, bannière ou aimage quelconque), il doit se terminer par "-trans.png" (comme mon avatar). Si vous omettez cette terminaison, le fond gris (ou celui spécifié par le bloc 'bKGd' de l'image -- cf. TweakPNG) s'affichera à la place de la transparence.

Voilà, à bon entendeur... bons PNGs transparents... sous IE ! ^^

Auteur :  SuperSeb [ Ven 04 Fév 2005 23:45:37 ]
Sujet du message : 

Ha ouais, donc c'est un truc qu'il faut mettre sur son site et non sur son IE... 0.0

Auteur :  Dioxaz [ Ven 04 Fév 2005 23:55:29 ]
Sujet du message : 

Hélas.... comme tous les PNG behaviours.

Sinon, essaie de renommer ton avatar (en 'av-trans.png' par exemple) et tu verras ^^.

Auteur :  SuperSeb [ Sam 05 Fév 2005 12:24:07 ]
Sujet du message : 

ça ne sera pas une priorité, je surfe sous Fofox... :P

Auteur :  Dioxaz [ Sam 05 Fév 2005 16:26:40 ]
Sujet du message : 

• SuperSeb
je surfe sous Fofox... :P


Ah oui, vu sous cet angle... c'est vrai que tout est mieux :roll:. (pas besoin de behaviour, là)

Auteur :  Arkthus [ Jeu 03 Nov 2005 21:27:38 ]
Sujet du message : 

Je vais mettre ça sur mon forum et je vais renommer mes images en -trans lol pasque je surfe sous fofox dans ma chambre, mais sur le PC de mon père c'est IE, et à la fac fofox déconne donc Ie aussi !

Par contre sur le forum je saipas trop où le mettre... dans le "overall_header.tpl" ? (si c'est pas Dioxaz qui répond mais que quelqu'un d'autre a la réponse, je suis preneur)

Auteur :  Lynx Aenslade [ Ven 04 Nov 2005 23:43:48 ]
Sujet du message : 

essaye de le metre dans divers dossier, puis si ca marche tu en suprime 1, puis si ca marche toujour tu en sumprime un autre, j'usqu'a ce que tu trouve le bon dossier ^^

Auteur :  SuperSeb [ Sam 05 Nov 2005 22:12:46 ]
Sujet du message : 

A défaut, tu le balance partout, comme ça t'es sûr qu'il y en a au moins un qui va être au bon endroit... :P

Auteur :  Arkthus [ Sam 05 Nov 2005 23:22:40 ]
Sujet du message : 

oh pis crotte ça marche pas... J'attendrait qu'il y ait un patch ou un truc pour modif IE, et je modifierai le IE de mon pôpa

Auteur :  Dioxaz [ Dim 06 Nov 2005 13:37:34 ]
Sujet du message : 

• Xeric
Par contre sur le forum je saipas trop où le mettre... dans le "overall_header.tpl" ? (si c'est pas Dioxaz qui répond mais que quelqu'un d'autre a la réponse, je suis preneur)

C'est bien dans le "overall_header.tpl" qu'il faut le mettre, juste après "<title>{SITENAME} :: {PAGE_TITLE}</title>".

Par contre, il te faudra effectuer quelques modifications dans ton fichier "pngfix.js" si tu veux qu'il te rende uniquement les PNG se terminant par "-trans.png" transparents.

Dans mon cas, le "pngfix.js" que j'avais fait pour ET6 à un époque ressemblait à ça :

• Code
// 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-10, imgName.length) == "-TRANS.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);

Voilà, j'espère t'avoir suffisamment éclairé, Xeric.

PS : je passais par là par hasard, alors que je consultais les stats pour mon site de walls !

Auteur :  Arkthus [ Dim 06 Nov 2005 17:19:21 ]
Sujet du message : 

ah pasque le PNG behaviour permet tous les PNG, sans forcément mettre -trans ? c'est donc juste une modif propre à ET6 ? ben c'est fabuleux, je vais laisser le fichier tel qu'il est pour le redesign de mon site


EDIT > les map ne marchant pas avec j'ai essayé leur alternative, les map marchent, mais c'esty pas transparent, même avec le pixel supplémentaire... je vois pas ce qui va pas

nan finalement c'est transparent, mais ça me décale à mort ma bannière et les map marchent pas, il a l'air doué le type qui fait ça, ça fait peur...

Auteur :  Dioxaz [ Lun 07 Nov 2005 15:19:24 ]
Sujet du message : 

Au fait, je ne t'ai pas précisé un truc. S'il y a d'autres fonctions Javascript utilisant des insctructions comme "OnMouseOver", "OnMouseOut", etc. (générallement des scripts permettant d'éteindre et d'allumer des boutons au passage de la souris), leur fonctionnement sera perturbé.
C'est soit le PNG behaviour, soit les autres scripts, pas les deux à la fois.

Sinon, il se peut peut-être que le behaviour marche avec d'autres types de scripts. (en fait, ce que j'ai dit, c'est valable pour tous les PNG behaviours)

Auteur :  Arkthus [ Lun 07 Nov 2005 17:01:47 ]
Sujet du message : 

j'ai contourné le problème simplement : pour la grosse bannière j'ai rempli le fond avec le background, vu que celle-ci ne bouge jamais dans la page, ça s'intègre parfaitement.

et pour tout le reste j'ai rempli avec le background qui leur correspond (blanc pour les titres par exemple), comme ça pas de soucis de PNG Behavior ;)

Auteur :  Spank [ Lun 07 Nov 2005 20:35:08 ]
Sujet du message : 

Moi je vois ni l'avatar de Xeric, ni ses bannières en transparent ... il y a un fond gris clair là où c'est sensé être transparent ...

Auteur :  Lynx Aenslade [ Lun 07 Nov 2005 21:27:32 ]
Sujet du message : 

moi ça marche sous firefox et IE (testé au bahut)

Auteur :  Spank [ Lun 07 Nov 2005 21:40:57 ]
Sujet du message : 

Ah ouais avec FireFox ça marche ^^'
Mais moi mon navigateur c'est AOL alors bon ... euh voila quoi ~~

Auteur :  Arkthus [ Mar 08 Nov 2005 01:28:37 ]
Sujet du message : 

si tu ne vois pas mes trucs en transparent c'est parce qu'ils ne se terminent pas par -trans.png, d'ailleurs je vais le faire de ce pas


EDIT > et là c'est mieux ? :D

hum ils se terminent par "-trans.png" mais je suis sur le PC de mon père, sous Ie, et ça n'est pas transparent

allez, on fait la ola en criant "vive microsoft" !

Depuis le temps ils auraient pu mettre un support PNG ces imbéciles -_-

Page 1 sur 1 Le fuseau horaire est UTC+1 heure [Heure d’été]
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
http://www.phpbb.com/