IE8 + lissage polices d'éléments montrés par JS

Bonjour,

Je découvre (?) un pb de lissage de polices supposées standard (trébuchet MS) sous IE8 (pas testé sous IE7 vrai) dans le cas suivant :

un div est masqué et n'apparait que sous certaines conditions par un script (jQuery).
- les h2 et h3 DANS ce div sont totalement pourries sous IE8 (lissage inopérant gros pixels façon 'fourrure'..)

Les mêmes h2 et h3 situés 4 lignes plus bas dans la page, mais qui ne subissent pas le masquage/réaffichage ne posent aucun pb.
(tout ok sous les autres navigateurs aussi).

Je précise que les polices mal lissées concernent des textes qui sont générés par le php et non par le js, et que, par conséquent, ils sont bien présents ds le DOM dès le début.

Y'a un truc connu la dessus que j'aurais raté ?

Merci
Modifié par elz64 (24 Nov 2009 - 11:28)

Bonjour,

L'effet de lissage dépend du navigateur, de la police en elle-même et peut-être même bien du système d'exploitation.

Il n'existe pas, à ma connaissance, de propriété CSS ou de script JS permettant de "lisser" un texte.

Es-tu certain que tes titres ont bien la même taille et la même graisse ? Possible que cela soit également lié à l'effet d'apparition jQuery...

Une page en ligne pourrait aider.

Merci.

Oui le pb vient bien de l'effet d'apparition, mes css sont uniformse il s'agit des mêmes h2 et h3, ceux dans le div masqué/affiché subissent le pb, pas ceux affichés plus bas dans la page et sans effet particulier.

L'effet de lissage ne dépend PAS prioritairement du navigateur mais bien de l'os (en tous cas sous les Windows),
il existe une option dans les options avancées de IE permettant de cocher ou décocher le lissage des polices par IE.
Ceci est décoché par défaut et, normalement, si on le coche cela pourri le lissage par double effet (nombreux pb trouvés à ce sujet partout sur divers forums).

Tout porte à croire que IE/ Windows n'arrive pas à lisser certains éléments apparus après l'affichage page proprement dit.

Je n'ai pas vu si cela concerne ou pas d'autres versions de Win que vista et seven.

la page concernée n'est pas publique mais sur un site d'un client nécessitant un login. Si je ne trouve pas j'essaierais de bâtir une page de démo reproduisant la chose.
Modifié par elz64 (25 Nov 2009 - 15:36)

J'ai constaté que sous IE8, avec l'outils de dev F12

le div qui subi l'effet de masquage reçoit un element style :

contenant : filter: alpha(opacity=100);

si avec le même outils on édite à la volée le html rendu pour éliminer ce truc de la ligne, instantanément, les polices redeviennent nickel....


(sous FF le rendu ne comporte bien sûr pas cela)

Salut j''espere que tu auras message.
J'ai le meme probleme que toi avec le lissage.
J'utilise un script jquery qui masque du contenu au chargement de la page.
Quand ce contenu se charge finalement tout le texte contenu dans cet element est non lisse.
enfin sur internet explorer.

Je voudrais bien comprendre ta methode.
Je n'ai pas reussi a cibler l'element qui pose probleme dont tu parles.

Ce serait extrement sympa si tu pouvais m'aider la dessus

Bonjour

Si ça peut en aider certains, je dépose mon témoignage à propos des polices non lissées sous IE.

Je viens en effet d'avoir ce problème de polices moisies avec IE 7 et 8.
Après moult recherches, je me suis aperçue que seul le texte contenu dans une div avec un ombrage fait en CSS3, et donc avec le filtre pour IE, était tout vilain.
J'ai donc désactivé le filtre pur IE et ô miracle, les polices sont redevenues lisses. Par contre je n'avais plus les ombres !

Je n'ai pas de solution à ce jour pour garder les ombres en CSS3 avec le filtre pour IE et une police "propre". Donc si quelqu'un a une idée...
Modifié par Clacla des Bois (25 Mar 2010 - 20:17)

Bonsoir -

j'ai le meme probleme (j'avais poste il y a quelques semaines mais sans reponse).

j'ai un texte enregistre sous forme d'image qui apparait avec un fadein jquery; nickel sauf avec IE ou durant le fadein le texte est non lisse, puis devient OK à la fin du fade in

Page www.latelierperles.fr

Extrait de code

	<div id="corps">
		<img id="msgaccueil" alt="" src="images_fond/cadreaccueil2.png" style="display:none"></img>	
	</div>

suivi de

<script type="text/javascript">
      $("body").ready(function () {
        $("#msgaccueil").fadeIn(6000);
      });
 </script>

Olivier

Bonjour,

J'ai eu le souci également.

Pour faire court, c'est un souci entre jQuery, IE et le lissage des polices sous windows avec Cleartype.

Il y a plusieurs solutions:
La première et la plus simple:
http://jquery-howto.blogspot.com/2009/02/font-cleartype-problems-with-fadein-and.html

L'inconvenient c'est que le lissage ne se fera qu'a la fin de l'animation, durant l'animation la police ne sera pas lissée.

La seconde solution:
http://malsup.com/jquery/cycle/cleartype.html?v3

Permet de faire un lissage durant l'animation.

Bonjour,

Sinon j'avais réglé mon pb en ajoutant un background sous le texte concerné. Pas forcément faisable dans tous les cas, mais c'est le transparent qui posais le souci.