Font-face en android 4.0.x no funciona

Estoy construyendo una aplicación móvil con JQM y necesito declarar fuentes propias con font-face.

Estoy incluyendo el archivo fuente css fonts.css como el primer archivo css cargado en mi index.html y declaró la font-faces como este:

 @font-face { font-family:"MyFont"; font-weight:normal; font-style:normal; src:url("fonts/MyFont.woff"); src:url("fonts/MyFont.eot?") format("eot"), url("fonts/MyFont.woff") format("woff"), url("fonts/MyFont.ttf") format("truetype"), url("fonts/MyFont.svg#MyFont") format("svg"); } 

Mis dos dispositivos de prueba son Google Nexus 7 con Android 4.2.1 y un Motorola Razr con Android 4.0.4 .

En Google Nexus, funciona tanto en Chrome móvil como en PhoneGap. Pero en el Motorola Razr, funciona sólo con Chrome móvil. Tanto el navegador de Android de acciones como Phonegap no utilizan MyFont .

¿Hay alguna solución para obtener el trabajo de mi fuente en Android 4.0.x?

Interesante. Estoy teniendo la experiencia inversa.

Tengo un Galaxy Nexus que ejecuta 4.2.1 (CM 10.1), que estaba cargando fuentes absolutamente bien hasta la actualización, pero ha empezado a ser realmente extraño con el CSS desde la actualización (sólo en el WebKit nativo, no en Chrome, que todavía funciona) .

Me di cuenta de que no era el problema de font-face, pero que la especificidad CSS se está estropeando (usando bootstrap como base y luego reemplazándome con mi propio CSS). Incluso los estilos en línea no aparecen si bootstrap incluido, todo funciona bien si bootstrap eliminado. Muy extraño.

En cuanto a su reverso de mi problema, un par de pensamientos:

  • ¿Por qué el primer src con un .woff? Lo he visto con un .eot para IE modo de compatibilidad hacia atrás, pero los navegadores que utilizan .woff debería ser capaz de utilizarlo desde el segundo src. Tal vez tratar de eliminar el primer src? (Esto no debería ser el problema, ya que WebKit debería sobrescribir con el segundo src)

  • ¿Cómo se están cargando los archivos de fuentes? De almacenamiento local? ¿De un servidor web? Sé que con Firefox si el servidor con los archivos de fuentes es diferente de los archivos con el tipo, no se cargará sin un encabezado de Autorizar Origen.

  • ¿Necesita cargar esta misma definición de fuente en otros navegadores que no son webkit? Si no, considere quitar todos los archivos excepto el .woff.

  • ¿Estás seguro de que el problema es la fuente-cara? Intente establecer la declaración de fuente a una fuente de sistema que no sea predeterminada (como 'serif'). Ver si la declaración de fuente se está aplicando, o podría ser que su font-face está bien, pero el css es de alguna manera no aplicar la fuente para el tipo? (Como ha sido mi caso esta semana pasada)

Es un poco difícil de saber sin información adicional. Su declaración @ font-face, aparte de la rareza del primer src que es un .woff, parece que debería funcionar bien. Mi conjetura es la edición miente en otra parte, no con ese fragmento del código.

Editar:

Rastreé mi problema — en Android 4.2.1 la opción CSS de text-rendering: se comportaba muy diferente a Chrome y las versiones anteriores de Android. Si está utilizando esta opción, consulte si cambiar o quitarla corrige el problema para usted. Es lo único que puedo pensar que he visto como diferente en cómo Android 4.0 vs Android 4.2 webkit ha sido la prestación de fuentes.

FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.