carga aleatorias de imagenes con link cada una

toiaqui · #1 (**permalink**) 02/02/2005, 18:18

hola

Me gustaria un script y la forma de llamarlo para realizar lo siguiente.

En mi web quiero 3 imagenes independientes.
Me gustaria que al recargar la pagina,estas 3 imagenes cambiaran aleatoriamente y que dependiendo de la imagen que sale pues la propia imagen linkea a otra web.

Ademas me gustaria saber si este javascript se puede tener en otro archivo independiente para asi poder controlar mejor sus parametros y evitar que en el html sea tan extenso. Si es posible esto, pues me gustaria saber como se hace.

Otra cosa es saber si necesitara vamos a suponer 5 funciones para realizar lo que qiero, estas 5 funciones pueden ser guardadas en el mismo .js y utilizarlo cuando queramos en la web? ..o cada cosa tiene que ir en su .js independiente?

A continuacion or remito un codigo que uso para la carga de imagenes aleatorias por si os puede ayudar a la creacion del script que necesito.

Saludos y gracias

========================================
<html>
<head>
<script >
var objetos = new Array();
objetos[0] = "../papanoel.gif";
objetos[1] = "../miemoticon.gif";
objetos[2] = "../papanoel2.gif";

function aleatorio() {
var azar = Math.floor(Math.random() * objetos.length);
document.images["imagen"].src = objetos[azar];
}
</script>
</head>

<body onload="aleatorio()">
<img src="" name="imagen" />
</body>
</html>================================================== ===

Untergang · #2 (**permalink**) 02/02/2005, 21:06

Y porque no lo haces con document.write ???

En cuanto al archivo... tengo entendido que no importa si todo va en uno o cada uno en varios!!!

caricatos · #3 (**permalink**) 03/02/2005, 01:48

Hola toiaqui:

Fíjate en el siguiente mensaje: http://www.forosdelweb.com/showthrea...ight=aleatorio

Puedes fijarte que en el mensaje se proponen 4 imágenes, si tienes dificultad para adaptarlo a 3 danos un aviso, pero te adelanto que tienes que eliminar las comparaciones donde esté temp[3]...

Sobre el uso en fichero externo, la respuesta es si, tan solo tienes que copiar lo que hay dentro de la etiqueta script en un documento nuevo, y en la etiqueta script quitas el contenido y le agregas el atributo src con el nombre del documento en cuestión.

Saludos

toiaqui · #4 (**permalink**) 03/02/2005, 06:45

hola

Gracias por la respuesta, voi a probar a ver si se hacerlo...eliminaré referencias a temp3 a ver si soy capaz de hacerlo, que de javascript no tengo ni idea. Pruebo y si no sale, pos te remito el post para que me des una ayuda.

Otra cosa..como bien me confirmas, se puede meter un script en un .js ...
Se podrian meter todos los scripts usados en la web en un mismo archivo .js
y llamar al que qeramos usar desde alli? si se pudiera hacer..
retardaria la carga de la web al tener que leer todos los scripts?

Saludos y gracias

toiaqui · #5 (**permalink**) 03/02/2005, 07:11

Tal como me suponía....no soy capaz de implementar eso para 3 imagenes

Me posteas el resultado?

saludos

caricatos · #6 (**permalink**) 03/02/2005, 08:58

Hola otra vez:

Te voy a responder rápido porque no tengo mucho tiempo, pero es básicamente así lo que debe ser el final del bucle while (no lo he probado).
Cuando tenga más tiempo lo miro mejor.

Código:

while (    temp[0] == temp[1] || 
        temp[0] == temp[2] || 
        temp[1] == temp[2]
)

Lo de poner todos los scripts en un fichero js también es posible, pero los informáticos suelen decir: "divide y vencerás"

Saludos

toiaqui · #7 (**permalink**) 03/02/2005, 09:01

ok..gracias..yo ahora tampoco tengo mucho tiempo de probar, que las obligaciones laborales llaman.

Me quedo a la espera de que lo puedas ver con detenimiento y postearlo. (si es posible, postear el codigo entero final...que como te dije...yo de javascript nulo..)

saludos y gracias

caricatos · #8 (**permalink**) 04/02/2005, 02:31

Bueno:

Adjunto un código que parece que funciona bien:

Código:

<html> 
<head> 
<title> 
    3 imágenes sin repetir 
</title> 
<script> 
var imagenes = [ 
    "http://www.sucaricatura.com/2002/maxi/2002H001.jpg", 
    "http://www.sucaricatura.com/2002/mini/2002H002.jpg", 
    "http://www.sucaricatura.com/2002/maxi/2002H003.jpg", 
    "http://www.sucaricatura.com/2002/mini/2002H004.jpg", 
    "http://www.sucaricatura.com/2002/maxi/2002H005.jpg", 
    "http://www.sucaricatura.com/2002/mini/2002H006.jpg", 
    "http://www.sucaricatura.com/2002/maxi/2002H007.jpg" 
]; 

var enlaces = [ 
    "http://www.sucaricatura.com/2002/maxi/2002H001.jpg", 
    "http://www.sucaricatura.com/2002/mini/2002H002.jpg", 
    "http://www.sucaricatura.com/2002/maxi/2002H003.jpg", 
    "http://www.sucaricatura.com/2002/mini/2002H004.jpg", 
    "http://www.sucaricatura.com/2002/maxi/2002H005.jpg", 
    "http://www.sucaricatura.com/2002/mini/2002H006.jpg", 
    "http://www.sucaricatura.com/2002/maxi/2002H007.jpg" 
]; 

function azar()    { 
    var temp = new Array(3); 
    temp[0] = Math.floor(Math.random() * imagenes.length); 
    do 
        temp[1] = Math.floor(Math.random() * imagenes.length); 
    while (temp[0] == temp[1]) 
    do 
        temp[2] = Math.floor(Math.random() * imagenes.length); 
    while (temp[0] == temp[1] || temp[0] == temp[2] || temp[1] == temp[2]) 
    document.getElementById("enlace1").setAttribute("href", enlaces[temp[0]]); 
    document.getElementById("enlace2").href = enlaces[temp[1]]; 
    document.getElementById("enlace3").href = enlaces[temp[2]]; 
    document.images.imagen1.src = imagenes[temp[0]]; 
    document.images.imagen2.src = imagenes[temp[1]]; 
    document.images.imagen3.src = imagenes[temp[2]]; 
} 
</script> 
</head> 
<body onload=azar()> 
<a href="#" name="enlace1"> 
<img src="" name=imagen1> 
</a> 
<a href="" name=enlace2> 
<img src="" name=imagen2> 
</a> 
<a href="" name=enlace3> 
<img src="" name=imagen3> 
</a> 
</body> 
</html>

Espero que te funcione.

Saludos

toiaqui · #9 (**permalink**) 04/02/2005, 06:49

Perfecto

Muchisimas gracias