PNG TRANSPARENT + OPACITY = BUG SUR IE7

Bonjour,

J'aurais besoin de votre aide !
J'ai passé toute l'après midi d'hier à écumer le web pour trouver une solution... sans succès !!!
J'ai même utiliser la fonction recherche sur alsacreation... c'est pour dire

Bon, je vous explique mon problème :
- j'ai un PNG-24 transparent
- j'ai un JS qui joue sur l'opacité de l'image pour la faire apparaitre en fondu
(*pour ceux qui ne connaissent pas JS et qui ne voient pas ce que je veux dire par la on peut reproduire le même bug en mettant simplement en css, une "opacity" ou "filter:alpha" à un png transparent)

Résultat :
=> Firefox : nickel
=> IE7 : le PNG est dénaturé... il y a comme un liseret noir autour de l'élément détouré et le dégradé sous l'élément est devenu opaque... par contre, la transparence générale a été conservée

En faite, ça rend tout simplement l'image "crade" sous IE7 !!!

Exemple en image :



>>> une idée ??? une solution ???

Thomthom
Modifié par thomasdepanam (28 May 2010 - 11:17)

Up

Personne n'a d'idée ???

Salut,

Il n'y a que des solutions imparfaites.

Si tu peux, en mettant une couleur au background tu vas résoudre le problème.

Sinon il te faudra utiliser filter: progid:DXImageTransform.Microsoft.AlphaImageLoader ,qui est une solution lourde a mettre en place et qui a des problèmes de performances.

Bonjour Mat,

Tout comme toi, j'ai vraiment l'impression qu'il n'existe pas de solution !!!
Meme avec le filter MS, c'est toujours crade...

Bref, c'est vraiment #chiant# qu'il n'existe toujours pas de hack pour varier l'opacité d'un PNG transparent sur IE

Thom

Bonjour

Avis d’un débutant "confirmé" , plus j’avance et plus je rencontre de problèmes avec les navigateurs de Microsoft (6, 7, 8), que ce sois les transparences, le JS etc…

Concevoir ou plutôt intégré un Design de sorte qu’il sois plus ou moins compatible au mode de rendu des différents navigateurs, pour moi ce résume presque à dire, 50% Microsoft, 50% pour tout les autres navigateurs.

Quand on parle de CSS, HTML, JS, bref frond end, je me demande si il ne faudrait pas avoir des forums qui ne ce consacre qu’au seul et unique problème de ces navigateurs.

Après quand on me dit tant pis pour le rendu des navigateurs Microsoft, tout sa avec des arguments, ils changeront de navigateurs si les intégrateurs ne fond plus d’effort ou alors un rendu plus ou moins bon avec un avertissement que le navigateur est obsolète, mais c’est pas IE6, IE7 c’est belle et bien tout la gamme qui est obsolète.

Petit exemple drôle, l’autre jour je discute avec un pro IE, et il me dit que sa coute trop cher de déployé un navigateur modern sur tout les postes, mais quand je vois leurs Intranet ou tout à été basse sur ActivX & co, bref que des solutions propriétaires qui sont inadapté au navigateurs modern, qu’on ne me dise pas que le déploiement coute cher mais plutôt qu’ils ont fait le mauvais choix et ils continuent à le faire.

Comme le H264, Apple, Microsoft, les arguments à 2 cents, hein.

Merci 3arly3F pour ce témoignage totalement déconnecté de la réalité et qui n'apporte rien au sujet...

3arly3F a écrit :
Concevoir ou plutôt intégré un Design de sorte qu’il sois plus ou moins compatible au mode de rendu des différents navigateurs, pour moi ce résume presque à dire, 50% Microsoft, 50% pour tout les autres navigateurs.

Sans vouloir t'offencer, c'est que tu t'y prend mal. Adapter un site pour IE6 ou 7 ça demande quelques commentaires conditionnels et un peu d'expérience.

3arly3F a écrit :
Après quand on me dit tant pis pour le rendu des navigateurs Microsoft, tout sa avec des arguments, ils changeront de navigateurs si les intégrateurs ne fond plus d’effort ou alors un rendu plus ou moins bon avec un avertissement que le navigateur est obsolète, mais c’est pas IE6, IE7 c’est belle et bien tout la gamme qui est obsolète.

Oui mais non, les gens ne changeront pas de navigateur pour un site (ou même plein), puisqu'il n'ont pas le choix. Ces gens ne viendront tout simplement plus sur le site (c'est pas difficile de trouver des alternatives sur le net).

3arly3F a écrit :
Petit exemple drôle, l’autre jour je discute avec un pro IE, et il me dit que sa coute trop cher de déployé un navigateur modern sur tout les postes, mais quand je vois leurs Intranet ou tout à été basse sur ActivX & co, bref que des solutions propriétaires qui sont inadapté au navigateurs modern, qu’on ne me dise pas que le déploiement coute cher mais plutôt qu’ils ont fait le mauvais choix et ils continuent à le faire.

Je ne vois pas en quoi cela est drôle, c'est la réalité, point. Certes il y a eu un mauvais choix (mais à l'époque il n'était pas si mauvais que cela) et un peu de flemme dans le suivi de l'application, mais c'est bel et bien une absence de moyen qui retarde la MAJ d'IE6 (car il faut recoder tous les Intranets).

Laurie-Anne a écrit :
Merci 3arly3F pour ce témoignage totalement déconnecté de la réalité et qui n'apporte rien au sujet...

Bon c’est vrai sa ne fait pas avancer le schmilblick, désoler pour ce petit troll.

Laurie-Anne a écrit :
Sans vouloir t'offencer, c'est que tu t'y prend mal. Adapter un site pour IE6 ou 7 ça demande quelques commentaires conditionnels et un peu d'expérience.

Offenser non, quoi que, avec un petit bonjour sa passe mieux, quand à l’expérience tu as raison j’en manque cruellement, mais malheureusement sa ne s’achète pas, mais je me soigne.

Ce que je voulais dire par là, on pourrais consacré une partie entière d’un site que pour les petits soucis rencontré avec IE, bien sur on trouve toujours une alternative, plus ou moins bonne selon les cas.

Désoler pour cette intrusion un poil trollesque dans ton poste Thomasdepanam.

Laurie-Anne a écrit :
Adapter un site pour IE6 ou 7 ça demande quelques commentaires conditionnels et un peu d'expérience.

Surement... mais dans ce cas concret, il est impossible d'obtenir un résultat similaire sur IE !
IE gère très mal le jeu d'opacité en css ou java d'un PNG transparent encodé en 24... et il n'existe à ce jour aucun hack fonctionnel pour régler ce problème.

C'est super embêtant... je me suis donc résigné à utiliser des conditions pour ne pas jouer l'opacité sur IE et la conserver sur les moteurs gecko... mais bon IE, c'est quand même 54% pdm !!!

Thom

thomasdepanam a écrit :
Surement... mais dans ce cas concret, il est impossible d'obtenir un résultat similaire sur IE !

Et c'est bien là le principal problème : il ne faut pas chercher à avoir un résultat similaire, mais a avoir un site navigable et un contenu accessible sous IE6. La différence est énorme.

Dans le cas de la transparence d'image, sous IE6 ou se contentera de transparence absolue (et non partielle) de type gif, avec un contour blanc pas des plus joli, mais qui ne choque pas.

Dans le cas de l'utilisation d'opacity, il faut savoir abandonné l'idée pour certains navigateurs. Pour IE7, le plus simple reste l'utilisation d'une image de fond en PNG ; pour IE6, il n'y aura pas de transparence.

Bonjour,
J'ai rencontré le souci entre un PNG transparent ,un plugin Jquery et IE7. Chez moi le bord transparent était joli jusqu'au milieu et ensuite il était deux fois trop foncé
dans ma feuille de style IE j'ai juste mis un zoom:1
A tester quand on rencontre un souci avec IE6 (sur les z-index de manière générale) et parfois avec IE7.
Apparemment cette propriétés remettrait l'élément dans le flux du DOM ou quelques chose comme cela. Mais le plus fou c'est que cette astuce marche assez souvent quel que soit le problème quand on a essayé par tous les autres moyens (c'est le miracle de IE )