:: SIFR. Uso de tipografías

SIFR es una libreria que nos permite el uso de cualquier tipografía en un sitio web, independientemente de que el usuario la tenga o no instalada en su equipo.
Esta solución(Scalable Inman Flash Replacement) utiliza CSS, javascript y flash para reemplazar el texto de una determinada etiqueta por una animación flash que contiene la tipografía a utilizar.

Los pasos para hacer uso de la libreria son los siguientes:

1.- Decargaremos la libreria SIFR de la siguiente url: www.mikeindustries.com/blog/sifr/

2.- Descomprimiremos el fichero descargado en la carpeta correspondiente

3.- En nuestra página especificaremos las hojas de estilo que utilizaremos con la librería

sIFR-screen.css
sIFR-print.css

4.- Insertaremos el código javascript para hacer uso de la librería

script src="sifr.js" type="text/javascript"

5.- Exportar el fichero sfir.fla a .SWF
Abriremos el fichero .fla y modificaremos el contenido necesario. Para proceder a su exportación seleccionaremos:Archivo > Exportar
Para llevar a cabo este proceso de exportación, los siguiente ficheros deberán estar en la misma carpeta que el fichero sfir.fla, pero no tendremos que subirlos al servidor:
- customize_me.as (fichero ActionScript)
- dont_customize_me.as (fichero ActionScript)

6.- Configuración de sIFR
Podemos modificar el comportamiento de la libreria mediante la asignación de un valor booleano a determinadas propiedades. Este proceso podemos llevarlo a cabo en una función javascript.

if(typeof sIFR == "function"){
sIFR.bHideBrowserText = false;
sIFR.setup();
};

Mediante el código anterior, indicamos que el texto a mostrar se muestre durante la carga de la librería.

7.- Reemplazar la fuente
Para proceder al reemplazo de la fuente deseada, llamaremos al método:

sIFR.replaceElement

Para la llamada al método debemos pasar una serie de parámetros en el orden indicado:
- sSelector. Selector utilizado para reemplazar las clases CSS
- sFlashSrc. Ruta del fichero swf
- sColor. Color
- sLinkColor. Color del enlace
- sHoverColor. Comportamiento del "hover" del enlace
- sBgColor. Color de fondo
- nPaddingTop, nPaddingRight, nPaddingBottom, nPaddingLeft. Espaciado
- sFlashVars. Variables adicionales pasadas al flash
- sCase. Paso a mayúsculas o minúsculas
- sWmode. Transparencia

if(typeof sIFR == "function"){
sIFR.replaceElement("titulo", named({sFlashSrc: "./netic360.swf", sColor: "#DCDCDC", sCase: "upper"}));
};

Más información: www.mikeindustries.com/blog/sifr