HTMLpointHTMLpoint HTMLpoint.com


 Scroller con texto e imágenes 1/5

 por Massimiliano Valente

Los visitantes asiduos de los sitios web albergados por Geocities, habrán seguramente notado desde hace algunos meses la presencia de un inédito instrumento de promoción en las portadas de los "geociudadanos". Se trata de un logo en formato gráfico GIF, con enlace asociado a la portada de la comunidad. Un procedimiento automatizado permite visualizar dicho logo cada vez que se abre la página, sin que el usuario haya insertado ningún código o llamamiento del mismo. Pero lo que nos interesa destacar ahora es que el logo permanece fijo en la parte inferior derecha del documento incluso con scroller de página. De esta manera, el logo adquiere mayor visibilidad y, como consecuencia, la posibilidad de que hagan clic en él aumenta.

Este efecto gráfico es posible gracias a HTML dinámico, el cual mediante los argumentos correspondientes hace compatible el uso con la cuarta generación de Internet Explorer e Netscape.

El presente artículo nos enseña a mantener fija una imagen o un mensaje de texto, incluso en caso de scroller de página, valiéndonos de los instrumentos puestos a disposición por el HTML dinámico.

Ante todo es necesario crear una imagen con extensión GIF o JPG para insertar en el ejemplo. Si bien resulta indiferente el uso de un formato gráfico u otro, es aconsejable adoptar el GIF para hacer que un color se vuelva transparente, armonizando la imagen con el resto de la página.

El código javascript relativo al funcionamiento de la demo, se inserta en un archivo externo con extensión .js. La razón de esta elección, preferible a la inserción en la misma página HTML, reside en la previsible exigencia de insertar el logo fijo en todas las páginas del sitio. Invocando el archivo externo script.js desde cualquier página, obtendremos la ventaja, no indiferente, de que, en caso de modificación del mismo, no será necesario modificar decenas de páginas sino tan sólo el archivo externo que contiene el código javascript. Si, por ejemplo, necesitamos sustituir el enlace asociado a la imagen, intervendremos sólo y exclusivamente en el file .js externo y, automáticamente, todas las páginas HTML que invocan ese file adoptarán la modificación.

El ejemplo, por tanto, consta de tres archivos: script.js, esempio01.htm y staticlogo.gif.


  Vuelve a principio de página