Le rendu des pngs transparents de IE8 est FUBARé sur mon site

Je viens de télécharger la version complète d'IE8 pour pouvoir tester un site que je viens de créer. [Exemple supprimé]Le rendu des pngs transparents de IE8 est FUBARé sur mon site

Focus sur l'image d'arrière-plan de la barre latérale gauche. Il est supposé être une image 1x1 semi-transparente .png qui se répète. IE8 le rend comme un dégradé !!! Cela devient encore plus difficile lorsque vous essayez de faire défiler votre fenêtre ou votre souris sur la barre latérale.

J'avais déjà testé ce site dans les navigateurs standards (IE7, Firefox et Chrome). Il ressemble exactement à ce que j'ai conçu dans ces derniers. IE8 est FUBARed cependant. J'ai essayé de mettre IE8 en mode "IE7" mais il a l'air encore un peu merdique. IE 8 en mode IE7 ne fait évidemment pas la même chose que le véritable IE7. Pas même le "IE7 meta tag" fonctionne.

Est-ce que quelqu'un d'autre a eu des problèmes comme celui-ci? Je pensais que IE8 était censé être une amélioration, pas un pas en arrière.

P.S. Veuillez excuser le balisage merdique sur cette page. J'ai utilisé la fonction "enregistrer la page entière" d'IE.

Source

2009-03-20 Christian Schlensker

Je ne vois pas la question. Il semble exactement le même sur IE 8.0.6001.18702 comme il le fait sur FireFox 3.0.7 – mhenry1384

J'ai rencontré ce problème sur la version exacte des mentions mhenry1384 ci-dessus, IE 8.0.6001.18702. Comme suggéré ci-dessous, en changeant le .png background-image que j'utilisais à un pixel 1x2 a résolu le problème. Merci d'avoir posté votre question. – zombat

Il peut s'agir d'une erreur de rendu dans IE8, ou peut-être d'une fonction de lissage des bords des images répétées qui vous donne un résultat inattendu. D'une manière ou d'une autre, il n'est pas très surprenant que vous ayez des problèmes avec une si petite image. Est-ce que vous vous rendez compte que le navigateur doit dessiner l'image 190152 fois pour rendre la page? J'utilise un png semi-transparent 10x10 comme arrière-plan pour un div dans une page, et il rend très bien dans IE8.

Source

2009-03-20 18:24:33 Guffa

La taille de l'image n'a pas d'importance sur le modèle remplit les moyens de performance. Le logiciel (ou l'accélération matérielle) définit la couleur de chaque pixel en obtenant mathématiquement la couleur de pixel décalée sur le motif de remplissage. Ainsi, le pixel dans (10,10) sera rempli par (5,5) d'un motif 5x5, (2,2) d'un motif 4x4, ou (1,1) d'un motif 1x1. Encore plus, un motif 1x1 peut être donné un cas spécial, ce qui signifie que toute la zone sera remplie d'une couleur solide, ce qui peut augmenter la vitesse pour certaines plates-formes. Alors, n'hésitez pas à utiliser 1px helpers si nécessaire. – SuperDuck

@SuperDuck: La taille ne devrait pas avoir d'importance, mais évidemment c'est le cas. Je me souviens de Netscape 4 où les images répétées ne fonctionnaient pas du tout, à moins qu'elles ne dépassent plusieurs pixels ... – Guffa

Oui, cela importait à cause de quelques bugs. Mais je ne parle pas de performance (c'est-à-dire que le nombre de tuiles ne fait pas de différence). Les images 1x1 sont très couramment utilisées par les logiciels incluant Dreamweaver et MS. En tout cas, je vous vois concerné et c'est pourquoi j'ai utilisé des images plus larges à l'époque de Netscape. – SuperDuck

Pourrait vouloir vérifier this post.

Source

2009-03-20 18:05:10

J'ai corrigé le bogue et ce n'est pas le problème de gamma mentionné dans cet autre article. Mon problème a été causé par le fait que l'image est de taille 1x1 pixel. Je l'ai juste changé en 1x2 et cela a réglé le problème. Bizarre

[modifier] Juste vu le post de Guffa après que j'ai demandé ceci. Voir son pour la réponse.

Source

2009-03-20 18:41:17

Je le ferais définitivement plus grand que ça. Les images d'arrière-plan très petites ont causé des problèmes de performance épouvantables dans les navigateurs du passé. Cumuler jusqu'à, disons, 64x64 ne vous coûterait pas beaucoup de taille de fichier. – bobince

J'ai essayé d'abord avec la correction gamma en utilisant pngcrush - ne fonctionnait pas - donc j'ai essayé cette approche - l'image 5x5 px ne l'a toujours pas prise, ni 10x10 - donc essayé avec 64x64 et ça fonctionne magiquement. – easwee

J'ai eu un problème similaire avec un site que je construis. Le problème ne s'est produit que sur 50% des machines avec ie8 sur lesquelles il a été testé, je le construisais pour une firme informatique et j'avais donc accès à beaucoup d'ordinateurs. Nous avons été en mesure de "résoudre" le problème en basculant l'Accélération matérielle sur les machines à problèmes, pas que ce soit vraiment une solution du tout.

Source

2009-07-21 02:07:33

on ou off: basculer n'est pas idempotent –

Merci pour l'aide sur cette question - quel bug étrange. Je rencontrais également le problème sur 50% des ordinateurs fonctionnant sous IE8 (j'avais accès à un bon nombre de machines). Quand j'avais un fichier png semi-transparent 1x1px en tant qu'image de fond sur un div avec CSS, IE le rendrait comme un dégradé vertical, funky et transparent. Changer l'image source en png 5x5px de la même opacité a corrigé le bug ... allez IE!

Source

2010-01-13 15:40:10 Drew

Le problème était mon original était .png 1 × 1, et pour une raison quelconque IE8 a été ne pas aimer essayer de tuile et gérer la transparence alpha au en même temps. Lorsque j'ai accidentellement enregistré cette image avec une copie beaucoup plus grande que j'ai avait sur mon presse-papiers, 100 × 100, il a terminé jusqu'à la fixation quel que soit le problème Internet Explorer était en train de traiter la transparence de png.

Source

2010-10-19 09:34:29

Le rendu des pngs transparents de IE8 est FUBARé sur mon site

Répondre

Questions connexes