Banners aleatorios sin actualizar la página
En un artículo anterior vimos como mostrar
banners en forma aleatoria al cargar la página, en esta ocasión veremos como hacer lo
mismo pero sin la necesidad de actualizar la página.
Primero debemos colocar el siguiente
JavaScript en la cabecera de la página (entre los tags <head> y </head>):
<SCRIPT
LANGUAGE="JavaScript">
<!-- Begin
var mfBanners = [
['http://www.direccion1.com', 'imagen1.gif'],
['http://www.direccion2.com', 'imagen2.gif']
];
var mfIe = false;
if( document.all) {
mfIe = true;
}
var mfBannerIndex = 0;
function mfBannerChange() {
var htmlString = '<a target="_blank"
href="'+mfBanners[mfBannerIndex][0]+'"> <img border="0"
src="'+mfBanners[mfBannerIndex][1]+'"></a>';
if( mfIe) {
document.all.banner.innerHTML = htmlString;
}
else {
document.layers["banner"].document.open();
document.layers["banner"].document.write( htmlString);
document.layers["banner"].document.close();
}
if(mfBannerIndex < mfBanners.length - 1)
mfBannerIndex++;
else
mfBannerIndex = 0;
}
setInterval("mfBannerChange()", 5000);
// End -->
</script>
El siguiente paso es ubicar la siguiente
línea en el cuerpo de la página, en la parte donde queramos que roten los banners:
<div
id="banner"></div>
Click aquí para ver el ejemplo funcionando
|