Problema con añadir regla CSS según el navegador, con Javascirpt

[berkeleyPunk]

Buenas noches.

Entiendo que IE (trabajo con la versión 11) no trabaja con las fuentes TTF, sino con las EOT.

Así las cosas, si el navegador resulta ser IE, entonces quisiera añadir una regla CSS con la fuente .eot. Y si resulta ser cualquier otro explorador, entonces añadir una fuente ttf.

Llevo lo siguiente, pero no sirve:

Código Archivo externo:

<link type="text/css" rel="stylesheet" href="hojaCSS.css" id="hojaCSS" />
 

Código Javascript:

<script type="text/javascript">
    window.onload = function()
    {
        var hojaCSS         = document.getElementById("hojaCSS");
        var infDelNavegador = window.navigator.userAgent;
        var trident         = infDelNavegador.indexOf("Trident");
        var version11       = infDelNavegador.indexOf("rv:11.");
        
        if( (trident != -1) && (version11 != -1) )
        {
            alert("Es IE");
            hojaCSS.innerHTML('@font-face {font-family:"Harlow Solid Italic"; font-weight:normal;   font-size:14px; src:url(HARLOWS.eot);}');
        }
        else
        {
            alert("No es IE");
            hojaCSS.innerHTML('@font-face {font-family:"Harlow Solid Italic"; font-weight:normal;   font-size:14px; src:url(HARLOWSI.TTF);}');
        }
    }
</script>
 

Código HTML:

<p>Este texto debe aparecer con fuente Harlowsi</p>
 

Saludos cordiales



PD. Perdón, se me fue. A ver si alguien puede mover este post a javascript.

[pzin]

Si que te complicas un poco.

Prueba a poner tu declaración de la fuente así:

Código CSS:

@font-face {
  font-family: 'Harlow Solid Italic';
  src: url('HARLOWS.eot');
  src: url('HARLOWS?#iefix') format('embedded-opentype'),
       url('HARLOWS.woff') format('woff'),
       url('HARLOWS.ttf') format('truetype'),
       url('HARLOWS.svg#harlow_solid_italic') format('svg');
  font-weight: normal;
  font-style: italic;
}
 

[berkeleyPunk]

Iniciado por pzin

Si que te complicas un poco...[/HIGHLIGHT]

Al parecer, sí. Puse el CSS que comentas pero no me funcionó. Entonces googlé con "CSS Incrustar fuente IE". Chequé algunas páginas, las contrasté con tu código, maestro pzin, y me funcionó la siguiente combinación:

Código CSS:

@font-face {
font-family: 'Harlow Solid Italic';
font-style:normal;
src:url('images/varios/HARLOWS.eot') format('embedded-opentype'), url('images/varios/HARLOWSI.TTF') format('truetype');
}
 

Pues quedó solucionado el problema. Creo que ya me emocioné con javascript.

Saludos y hasta luego.


PD. Antes de abrir este post, abrí otro al que, desgraciadamente, nadie a respondido. Maestro, pzin, ¿podrías dar tu opinión acerca de por qué IE11 muestra extraños con el CSS de dicho post? Ver post.

[pzin]

Con el código que te pasé debería de funcionar. De todas formas es siempre bueno cosa usar el generador de FontSquirrel.

[pzin]

Iniciado por berkeleyPunk

PD. Antes de abrir este post, abrí otro al que, desgraciadamente, nadie a respondido.

Lo miré antes por encima pero no tengo IE instalado.