HTMLpointHTMLpoint HTMLpoint.com


 Transiciones compatibles con NS 1/2

  semana 53 - 07 febrero 2000

Las transiciones de página permiten visualizar efectos similares a algunos cambios de imágenes televisivas. Dicho de otro modo, la página invocada no aparece directamente sino que va precedida de efectos de distinto tipo, tales como disoluciones y otras presentaciones.
Internet Explorer 4 o superior hace posible el uso de efectos de transición con simples marcas meta. Para mayor información, te remitimos a la página:

http://www.htmlpoint.com/css/css_12.htm Es posible obtener un efecto similar para ambos navegadores con algunas estratagemas técnicas, las cuales toman prestado código generalmente destinado a otros fines y efectos. En particular, se trata de un uso conjunto de hojas de estilo y código Javascript, mediante el cual se crean visualizaciones progresivas de la página con cinco efectos diversos:

esempio01.htm - líneas múltiples verticales
esempio02.htm - líneas múltiples horizontales
esempio03.htm - 2 líneas verticales
esempio04.htm - 2 líneas horizontales
esempio05.htm - visualización progresiva

El código necesario para generar estos efectos es común a todos los ejemplos, distinguiéndose sólo por valores de impostación.

Para visualizar una lista completa de los efectos, invoca el file "esempio.htm".

El ejemplo consta de 6 file: Para comprender más fácilmente el presente script, haz siempre referencia a los file antedichos, verificando los procedimientos y datos expresados. Sólo de esta manera, con una comparación continua, podrás entender las peculiaridades de este Javascript.

esempio01.htm

Antes de nada, hay que impostar la hoja de estilo dentro de las marcas BODY:


"layer-background-color:yellow" establece el color para la visualización progresiva con Netscape,y "background-color; yellow" con MsIE. En otras palabras, al abrirse la página, el fondo aparece todo amarillo, para ir dejando progresivamente espacio al contenido del documento propiamente dicho. Para impostar un color de fondo diferente del amarillo, basta con sustituir el valor "yellow" por otro color o, si prefieres, por un valor hexadecimal (p. ej., #FFFF00).

La impostación de la hoja de estilo, a excepción del color de fondo, es idéntica para los cinco ejemplos. En buena parte tampoco cambia de uno a otro la impostación sucesiva del código Javascript. He aquí el código que hay que insertar en el cuerpo del documento:


Existe, además, un código para volver a cargar la página sin que el navegador la recupere de la caché.


  Vuelve a principio de página