<Div> aleatorio

carlosarmikhael · #1 (**permalink**) 31/03/2013, 10:45

Buenas tengo un pequeño problema con el <div id="container"> necesito que las imágenes están contenidas AHÍ aparezcan de forma aleatorio.

Código HTML:

Ver original<!DOCTYPE html>
<html>
    <header>
    </header>
    <body>
        <div id="container">
            <img src="img1.jpg" />
            <img src="img2.jpg" />
            <img src="img3.png" />
            <img src="img4.png" />
        </div>
    </body>
</html>

pzin · #2 (**permalink**) 31/03/2013, 13:16

Con HTML sólo no podrás hacerlo, tendrás que usar JavaScript o algún lenguaje de servidor tipo PHP.

clopezp86 · #3 (**permalink**) 31/03/2013, 17:19

Prueba de poner esto:

Código:

<?php $aleatorio= rand(1, 5); ?>

<!DOCTYPE html>
<html>
    <header>
    </header>
    <body>
        <div id="container">
            <img src="img"<?php echo $aleatorio ?>.jpg" />
        </div>
    </body>
</html>

Este simple código elige un número aleatorio entre el 1 y el 5 (incluidos) y lo añadimos a la sentencia

Código:

<img src="img"<?php echo $aleatorio ?>.jpg" />

con un ECHO, así pues saldrá aleatoriamente:

Código:

            <img src="img1.jpg" />
            <img src="img2.jpg" />
            <img src="img3.jpg" />
            <img src="img4.jpg" />
            <img src="img5.jpg" />

carlosarmikhael · #4 (**permalink**) 31/03/2013, 20:27

muchas gracias por su respuesta pero... la linea <?php echo $aleatorio ?> no coloca ningún numero aleatorio :S entonces no muestra ninguna imagen porque no colo un numero que podria haceR?

ArturoGallegos · #5 (**permalink**) 31/03/2013, 21:49

y un slideshow no te sirve?

clopezp86 · #6 (**permalink**) 01/04/2013, 04:29

fijate que arriba del todo he puesto la sentencia:

<?php $aleatorio= rand(1, 5); ?>

esto hace que la variable $aleatorio coja un número comprendido entre 1 y 5, ambos incluidos

:)

emprear · #7 (**permalink**) 01/04/2013, 06:37

la solución pasa por usar javascript

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>secuencia imagen aleatoria</title> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
//<![CDATA[
mezclar = function(n){
    for(var j, x, i = n.length; i; j = parseInt(Math.random() * i), x = n[--i], n[i] = n[j], n[j] = x);
    return n;
};
var secuencia = [1, 2, 3, 4, 5];
var cadena = mezclar(secuencia).toString();
var numeros = new Array();
numeros=cadena.split(",");
//]]>
</script>
</head>
<body>
<div>
<script type="text/javascript">
//<![CDATA[
for (m=1;m<numeros.length;m++){
document.write("<img src='img" + numeros[m] + ".jpg' alt='' \/><br \/>\n");
}
//]]>
</script>
</div>
</body>
</html>

SAludos

carlosarmikhael · #8 (**permalink**) 08/04/2013, 08:37

Muchas gracias por su respuesta #emprear me fue de gran ayuda gracias :D