Rotar Banners en JavaScript

Si tienes puesto algún banner publicitario en tu web seguro que te habrás encontrado con el problema de que no puedes poner más de uno por su peculiar tamaño, pues con el siguiente script conseguirás poner tantos banners en un mismo sitio como te interese. Solo tienes que cambiar el texto en verde por las rutas correctas a la imagen y a la URL de la web.

<html>
<head>
<title>Rotar banners</title>
</head>
<body>

var cuantosbanners = 3 ;
var ahora = new Date()
var segundos = ahora.getSeconds()
var banner = segundos % cuantosbanners;
banner +=1;

if (banner==1) {
texto=" Entra en la web de banner1 ";
url=" http://www.banner1.com ";
alt=" Texto alternativo1 ";
imagen=" imagenes/banner1.gif ";
width=" 468 ";
height=" 60 ";
}
if (banner==2) {
texto=" Entra en la web de banner2 ";
url=" http://www.banner2.com ";
alt=" Texto alternativo2 ";
imagen=" imagenes/banner2.gif ";
width=" 468 ";
height=" 60 ";
}
if (banner==3) {
texto=" Entra en la web de banner3 ";
url=" http://www.banner3.com ";
alt=" Texto alternativo3 ";
imagen=" imagenes/banner3.gif ";
width=" 468 ";
height=" 60 ";
}

document.write('<center>');
document.write('<a href="' + url + '" target="_blank">');
document.write('<img src="' + imagen + '" width=')
document.write( width + ' height=' + height + ' ');
document.write('alt="' + alt + '" border=0><br>');
document.write('<small>' + texto + '</small></a>');
document.write('</center>');

//-->
</script>

</body>
</html>

El script del ejemplo está preparado para poner tres banners diferentes, pero puedes ampliar (o diminuir) esta cantidad a la que creas oportuna. Para ello tienes que indicar en la variable cuantosbanners el número exacto de imágenes que quieras poner. A continuación tienes que continuar (o borrar) la cadena que se repite por cada banner, cambiando el número contenido en: if (banner== 3 )... por el número que lo siga.

Por cada banner hay seis valores que pueden ser modificados. El primero de ellos es el texto que aparecerá debajo del banner. El segundo es la dirección web a la que quieras que se vaya al pinchar sobre el banner. En la propiedad alt, tienes que poner un texto alternativo que aparecerá en caso de que ocurra algún error en la carga de la imagen o al dejar el puntero del ratón sobre ella. El cuarto valor que aparece tiene que ser rellenado con la ruta de la imagen a mostrar y los dos últimos valores corresponden al ancho y alto de la imagen respectivamente.

Original de fuikas.tk

Usuarios que han visto este tema también han visto...

- Modificar elementos HTML con JavaScript
- Iluminación Gradual de Imágenes
- Links con fade en Javascript
- Listas dinamicas enlazadas
- Validando emails desde JScript

- Versión imprimible de este documento

- Enviar por e-mail este documento