mostrar imagen aleatoriamente

Sette · #1 (**permalink**) 29/02/2008, 08:49

vereis estoy creando un javascript para una web, donde quiero q aleatoriamente muestre imágenes, con el código q tengo ahora, va cambiando, pero siempre, en orden, a ver si podeis decirme como hago para q no empiece siempre con la misma y muestre las imágees de forma aleatoria

os dejo pegado el código:

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">



<HTML>

<HEAD>

<TITLE>Rotador de banners</TITLE>



<script type="text/javascript" language="JavaScript">

<!--

// Autor: Jallmalatesta

// web: http://empacho-de-melon.webcindario.com

// funciona en Internet Explorer 5.5+, Mozilla, Firefox y Opera 7



// El array de arrays "banners" almacenará la información necesaria de los banners que vamos a rotar.

// las urls son ficticias, y la carpeta y el nombre de los banners pueden ser otros

// se dan el ancho y alto de cada banner en píxeles



var banners = new Array();

banners[0]= new Array("http://url.enlace.0","rotadores/fotos/fotos/000.jpg","200","143" ) ;

banners[1]= new Array("http://url.enlace.1","rotadores/fotos/fotos/001.jpg","200","143" ) ;

banners[2]= new Array("http://url.enlace.2","rotadores/fotos/fotos/002.jpg","200","143" ) ;



// variable que contendrá el tiempo que tardará en cabiarse el banner:



var tiempo = 3000; // cuenta en milisegundos por lo tanto cambia cada 3 segundos.

var numero_banner = 0; //almacenará el número del banner que se mostrará, este es su valor inicial.



// función que cambia el número de banner que se visualizará. 

// Esta función se llamará por primera vez cuando se cargue la página, cuando se de onload();

function cambia_numero_banner(){

 numero_banner++;

 if (numero_banner >= banners.length) numero_banner= 0;

 rotabanner(numero_banner);

 setTimeout("cambia_numero_banner()", tiempo);

}



// función que dibuja el banner en la tabla

function rotabanner(numero_banner){

 var anuncio = "";

 anuncio = "<a href='"+banners[numero_banner][0]+"' target='_blanck'>";

 anuncio += "<img src='"+banners[numero_banner][1]+"' border='0' width='";

 anuncio += banners[numero_banner][2] +"' height='"+ banners[numero_banner][3]+"'></a>";

 document.getElementById('lugar_anuncio').innerHTML = anuncio;

}

 

//-->

</script>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><style type="text/css">
<!--
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
-->
</style></HEAD>



<BODY onLoad="cambia_numero_banner();">



<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td align="center"><table border='0' width='195'>
      <tr>
        <td align='Center' valign='top'><div id="lugar_anuncio"> <a href="http://url.enlace.0" target="_blanck"><img src="carpeta/banner0.jpg" alt="" width="190" heigth="143"></a> </div>
        </tr>
    </table>
      <div align="center"></div>
    <div align="center"></div></td>
  </tr>
</table>
</BODY>

</HTML>