Arreglando la impresión sIFR con CSS y MooTools -

Si bien no soy un gran defensor del sIFR, puedo entender su atractivo. Recientemente, un cliente nos pidió que implementáramos sIFR en su sitio web, pero me encontré con un problema: los encabezados de sIFR no se imprimían porque eran objetos Flash. A continuación se explica cómo solucionar el problema de impresión sIFR.

Índice de contenidos
  1. XHTML de muestra
  2. El CSS
  3. El JavaScript de MooTools

XHTML de muestra

h2Sample Heading 1/h2pLorem ipsum dolor sit amet, consectetur adipiscing elit. In ut lectus fermentum augue bibendum tincidunt. In hac habitasse platea dictamen. Nullam ornare nunc ac masa. Nam volutpat tempor tortor. Mecenas sapiens. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vestibulum a odio ut libero facilisis tincidunt./ph2Sample Heading 2/h2pLorem ipsum dolor sit amet, consectetur adipiscing elit. In ut lectus fermentum augue bibendum tincidunt. In hac habitasse platea dictamen. Nullam ornare nunc ac masa. Nam volutpat tempor tortor. Mecenas sapiens. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vestibulum a odio ut libero facilisis tincidunt./p

Sólo un poco de XHTML de muestra.

El CSS

@pantalla multimedia {.print-only{ pantalla: ninguna; }}@media print {.print-only { display:block; }.no-print{ pantalla: ninguna; }}

Establecer un par de estilos CSS estándar relacionados con la impresión.

El JavaScript de MooTools

$$('h2').each(function(el,i) {//new h2 de solo impresión new Element('h2',{ text: el.get('text') }).addClass('print- only').inject(el,'before'); //inyecta swiff en el actual h2el.addClass('no-print');var swiff = new Swiff('sifr450x23.swf',{ id: 'sifr-' + i, ancho: 450, alto: 23, contenedor: el, parámetros: { wMode: 'transparent' }, vars: { titleText:el.get('text') }}); });});

Primero inyectamos un nuevo elemento H2 que se utilizará para imprimir. Luego inyectamos el Swiff en el H2 original. Por supuesto, puedes ver dónde agregué las clases CSS de solo impresión/no impresión.

El único navegador que encontró que imprimió los objetos Flash sIFR fue Internet Explorer. Esta solución funcionará en todos los navegadores.

Te podría interesar...

Deja una respuesta

Subir