@ Font-face y el valor incorrecto del atributo offsetWidth

Me aparece este problema en la última versión de Chromium. Después de la creación del primer elemento utilizando una familia de fuentes incrustada a través de @ font-face Me están entregando los valores erróneos de offsetXyz. En el momento en que se ejecuta el script, el gancho window.onload ya se habrá disparado y la fuente ya habrá sido cargada.@ Font-face y el valor incorrecto del atributo offsetWidth

Esto es lo que el guión se parece a (esquemáticamente):

var e = document.createElement("span"); 
e["innerText" in e?"innerText":"textContent"] = "fooBar"; 
e.style.fontFamily = "fontFaceEmbeddedFontFamily"; 
document.body.appendChild(e); 

alert(e.offsetWidth); // Returns two different values 
setTimeout(function() { 
    alert(e.offsetWidth); // The latter being correct 
}, 1000);

El valor se actualiza de forma "silenciosa". Parece que no hay forma de esperar que corrija los valores, sino que simplemente establece Interval-verifica el valor y luego procesa la solución. No me gusta hacer cosas sucias como esa.

¿Alguien tiene alguna sugerencia de cómo proceder? Ocurre solo cuando el src: local(" ... ") no se especifica, por lo tanto, el problema se descarga, es decir, es específico de la fuente.

Fuente

2011-05-13 Witiko

Tal vez usted puede encontrar un poco de ayuda aquí: http://paulirish.com/2009/fighting-the-font-face-fout/ - parece que es bastante común que algunos navegadores muestren el texto "sin estilo" hasta que la fuente se haya descargado y luego cambie. – James

Bueno, como ya he dicho, la fuente ya debe estar cargada cuando ejecuto el script, ya que se llama ** después de ** el evento window.onload disparado. Ya está cargado y se aplica visualmente cuando el elemento se agrega al cuerpo del documento. Solo el valor de compensación es incorrecto. – Witiko

Ya ha dado la respuesta usted mismo. Establezca src: local() y no sucederá; en general, cuando usa @font-face, adhiérase a bulletproof syntax, ya que fue creado para solucionar problemas del navegador como el que usted está enfrentando aquí.

Fuente

2011-06-19 11:43:39

Lo sé, es casi un año, pero tengo este problema también y me llevó medio día descubrir la causa. Puede esperar a que se cargue la página completa, en lugar de usar un tiempo de espera excedido. El src: local() no hizo ninguna diferencia para mí. Así que usted puede utilizar:

<body onload="finished()">

o en jQuery:

$(window).load(
    function() { 
     // this only will execute when the entire page is loaded. 
    } 
);

Fuente

2012-01-22 07:28:37 hugotacito

¿No es más agradable ir con el segundo enfoque (como en ** no ** poner cosas en BODY-tag)? –

@ Font-face y el valor incorrecto del atributo offsetWidth

Respuesta

Cuestiones relacionadas