RSS
Google+
Twitter
FacebookSi bien Firefox 4 trae muchas mejoras y entre estas esta su soporte para muchas nuevas funciones de CSS3, he encontrado un error de renderizado de texto con la propiedad transition para un transform aplicado a un texto de cierto tamaño.
Por ejemplo, usando Firefox 4 se fijaran que al poner el cursor encima del siguiente texto de 100px, no hay cambios en su grosor ni pixelado:
Pero si cambiamos el tamaño del texto a 18px, algo raro pasa, en el momento de la animación (del movimiento) el texto se hace más delgado y al final cuando ya no se mueve el texto se vuelve más grueso.
Al menos esto me pasa con Firefox 4 en Windows 7. ¿A Ustedes?
Chrome y Safari
Esta falla no sucede con Chrome o Safari (ambos usan webkit) en ambos la frase nunca cambia de grosor sin importar su tamaño, y se ve muy fluida la animación de texto (aun teniendo sombra), de ahí que no creo que sea por el ClearType de Windows, sino por el mismo render de Firefox.
PD.- como se habrán dado cuenta este mismo fallo sale en la frase aleatoria de nuestro header (donde incluso es un poco más notorio). Se agradece si alguien encuentra una solución.
Seguinos en Twitter @aeromental y Facebook
¿Qué es Aeromental?
yo lo veo perfecto Windows 7 x86 Firefox 4
Confirmado en Firefox 4 sobre Ubuntu 10.04
AAR: ¿Confirmado que si te sale el error o que no te sale?
se ve rudo con el error =D
@Shadow_troublem
Gracias por comentar, pero: “Se ve rudo”, es una frase que desconozco, ¿eso es bueno o malo?
En firefox sobre ubuntu va bien se ve igual que en chrome.
Sin error en mi windows 7… aunque ahora que miro bien la ventana, arriba a la izquierda, al lado del menu naranja… hay unos pixeles sueltos. Un pequeño cuadradito blanco :-S
“Se ve rudo” es una forma decir que te gusta como se ve…
Hay que tener ojo de diseñador para notarlo, pero se nota… el FF siempre tuvo su punto más débil en el rendereo de texto y si no me equivoco utiliza el render del sistema operativo. Chrome y Safari usan sus propios engines de rendereo, es por eso que la misma tipografía tiene un atialiasing distinto.
Pero es un bug minimo comparado con la sutileza de la animacion, de hecho en el FX4 se nota mucho menos pixelado el texto en angulo que en las versiones 3.x
Firefox 4 en ubuntu 10.10: todo normal.
Firefox 4 en Windows 7 x86: todo normal.
Tanto en el texto de 100px como en el 18px e igual en el del header.
Creo que el problema aquí es que el tamaño de la fuente la defines con px, siendo que esto no es sugerido por diversos problemas de como lo interpreta cada navegador. Te recomiendo cambies todas las propiedades a “em” en lugar de “px”.
Si necesitas ayuda para eso sabes cómo contactarme.
Gracias saiseihogo.
Conozco em, y he probado de cambiar el texto a em, y aún así el error que veo sigue, y para mi si es algo muy notorio a la hora de ver la animación.
Será raro pero prefiero usar px en fonts, me da más precisión y control a la hora de cambiar un solo font del diseño sin intervenir en las herencias de los demás
FF4 – Fedora 12 OK
ptm! tanto lio por eso? Seguro que h ay que tener vista de diseñador para notarlo, pero cuantos diseñadores te visitan eh?
yo no vi ningun error, el texto aumenta su tamaño proporcionalmente al recuadro (eso si se pixelea un poco)
Firefox 4 en XP SP2:
Resultado Actual: El texto 2 sale en negrita en los frames inicial y final pero no dentro la transicion, pierde negrita.
Resultado Esperado: Texto no debe cambiar propiedades en la transicion ni en el final, deberia mantenerse el mismo.