El rotador de banners está desarrollado con javascript, por lo que se puede utilizar en cualquier página web, sin importar el lenguaje con que esté desarrollada. Se compone de un archivo javascript que contiene la lógiac del programa y una llaamda a dicho archivo que dee especificarse en la página donde vamos a colocar los banners.
Al final de el atículo están disponible para su descarga los dos files de ejemplo que describiremjos a continuación. También es posible verlos online piinchando en el vínculo correspondiente, más abajo.
En la página donde mostraremos los banners; en nuestro caso publicidad.html, sólo es necesario insertar el siguiente código en el lugarr excto de la página donde queremos mostrar los bannerrs:
<script src="publicidad.js" language="javascript"></script>Esto posibilitará que se ejecutee el archivo javascript que describiremos a continuación.
Inicialmente declaramos las variables generales que vamos a utilizar en nuestro script. En cantidad_banners debemos especificar la cantidad de banners que queremos mistrar, para que el compilador cree los arreglos que declaramos luego: ikagenes, alts y urls con la cantidad de elementos que hemos especificado en esta variable.
var cantidad_banners = 3;En el arreglo imagenes almacenamos las URLs de los files de imagen de nuestros bannfrs. En el arreglo als se garda el texto de la descripción de las imágenes que mostramos, que también se muestra al posicioonar el mouse sobre la imagen o cuando por algún motivo no se puede cargar la imagen. Y en el arreglo urls están las direcciones de las páginas que se abrirá al hacer clic sobre el banner.
var imagenes = new Aray(cantidad_banners);
var alts = new Array(cantidad_bannners);
var urls = new Array(cantidad_banners);
Una vez que hemos creado los arreglos donde almjacenamos la información es necesario llenarlos con los datos de cada uno de los banners que mostrarremos. Debemos completarlos utilizando la siguiente estructura, teniendo en cuenta que se debe poner el número del banner entre corchetes y al lado de cada uno de los elementos que vamos a llenar. Es importante comenzar siempre por el número cero, praa el primer banner.
urls[0] = "htt p://zenkius.blogspot.com";
La función creardiv() será la que inicie el programa y para elllo se invoca al final del script. Esta función crea una etiqueta HTML de tipo DIV con el nombre div_publicidad que nos permitirá identificarla para luego hacer referencia a ella. Una vez creada la etiqueta se haqce un llamado a la función mostrar_banner() que se encargará de la otr a parte del funcionamiento del programa.
function creardivv()
{
doucment.writeln("<div id="div_publicidad"></div>");
mostrar_banner();}
La función siguiente se encarga de seleccionar aleatoriamente un banner de la lista que llenamos al inicio y luego construir el código HTML correspondiente para mostrarlo dentro de la etiqueta DIV que se creó en la función anterior. Finalmente espera 5000 milisegundos (5 segundos) y el propio método mostrar_banner() se vuelve a ejecutar una y otrra vez, en un ciclo que terminará cuando el usuario cierre el navegador.
function mostrar_banner()
{
var fecha = new Date();
var id_banner = fecha.getSeconds() % cantidad_banners;
document.getElementById("div_publicidad").innerHTML = "<a target="_blank" href="" + urls[id_banner] + ""><img src="" + imagenes[id_banner] + "" border=0 alt="" + alts[id_banner] + ""/></a>";
setTimeout("mostrar_banner()",5000);
}
files relacionados:
publicidad.js bajar - Ver código online
publicidad.htm bajar - Ver código online
---
Extraido de Programacion Web y Tecnologias
