[ IE ] .png et transparence

VaN
Mammouth du PHP | 1107 Messages

07 sept. 2006, 17:47

Bonjour,

je viens de découvrir à ma plus grande stupéfaction que IE ne gérait pas la transparence des .png.

Je suis donc allé me renseigner sur le net, et j'ai trouvé des solutions, donc ce script :

Code : Tout sélectionner

<script type="text/javascript"><!-- //<![CDATA[ if (navigator.appName.substring(0, 3) == "Mic") for (i = 0; i < document.images.length; i++) if (document.images[i].src.substring(document.images[i].src.length-3, document.images[i].src.length) == "png") { document.images[i].style.height = document.images[i].height + "px"; document.images[i].style.width = document.images[i].width + "px"; document.images[i].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + document.images[i].src + ",sizingMethod='scale')"; document.images[i].src = "transparent.gif"; } //]]> //--></script> Le fichier "transparent.gif" est obligatoire. En réalité, c'est une image gif qui n'est autre qu'un pixel transparent. Pour que cela fonctionne, il faut aussi spécifier pour chaque image l'attribut width et height.
l'auteur du script précise bien qu'il faut spécifier les width et height de l'image .png.

Hors mon problème est le suivant : j'affiche mes images non pas par <img>, mais avec <input type="image">, car il faut que j'envoie des informations sur la prochaine page (récupérer via des radio button), lorsque je clic sur une de mes images .png.
(C'est en fait une boutique de t-shirt. les motifs sont affichés en .png, par dessus des background-image représentant des t-shirts. Les radio buttons servent à préciser si on veut afficher le motif sur un t-shirt, un sweat ou une veste).

Je génère ma liste d'images ainsi :
echo "  <td id=\"td".$nb_cells."\" style=\"background-image:url(graphs/shop/backgrounds/".$bg[$count].")\">
<input type=\"image\" name=\"motive_id\" src=\"graphs/shop/motifs/".$result['motif_referer'].".png\" 
value=\"".$result['motif_referer']."\" onClick=\"submit();\" 
style=\"padding:5px;border:1px dashed #AAAAAA;\" /></a></td>\n";
la page en question

Existe t'il une solution pour me sauver ?

- Soit passer les infos de mes radio button autrement que par formulaire, ce qui me permettrait d'abandonner mon formulaire, et donc mes <input type="image">
- Soit en réussissant en gardant mon formulaire.

merci à ceux qui tenteront d'apporter une solution.

Mammouth du PHP | 19672 Messages

07 sept. 2006, 17:48

Rectification : IE ne gère pas la transparence des png24, mais sait gérer celle du format png8
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

VaN
Mammouth du PHP | 1107 Messages

07 sept. 2006, 17:52

Oui je l'ai vu, mais un .png 8 équivaut à un .gif, c'est à dire que la transparence est soit du 0%, soit du 100%. Ce qui crée des contours hideux, alors que je souhaite un contour progressif, non pixellisé.

Avatar du membre
Modérateur PHPfrance
Modérateur PHPfrance | 10684 Messages

08 sept. 2006, 08:27

Pour que cela fonctionne avec IE il te faut jouer avec les filtres en attendant une version de IE qui supportera correctement ce format..

Jette un coup d'oeil ici : http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html :)

DooKie
Invité n'ayant pas de compte PHPfrance

16 sept. 2006, 16:14

tu peux arreter d'utiliser un input image.
Si tu mets une image avec la balise img, et que tu ajoutes la propriété onclick et le js adapté, ca envoie le formulaire..

genre <a href="#" onclick="document.form.submit()"><img src="imgs/test/1.png" alt="submit" /></a>

je sais pu trop si ca s'ecrit comme ca, mais dans le principe c'est ca