¿Cómo mostrar una imagen diferente cada vez que se carga la página web?
Con Javascript definitivamente es muy simple. Comencemos con un script que ya funciona para luego explicar cómo funciona.
img = new Array () img [0] = 'foto1.jpg "width =" "height =" "border =" "'; img [1] = 'foto2.jpg" width = "" height = "" border = "" '; img [2] = 'foto3.jpg "ancho =" "alto =" "borde =" "'; ran = Math.floor (3 * Math.random ()); document.write ("");
Tratemos de entender juntos cómo funciona el guión. Primero definimos la variable img como un vector.
img = nueva matriz ()
Luego asignamos el nombre de una imagen diferente a los tres primeros elementos (foto1.jpg, foto2.jpg,…). El contenido de los tres elementos son tres valores de cadena diferentes en los que se insertan los parámetros principales de la etiqueta. a través del cual se muestra una imagen en HTML.
img [0] = 'foto1.jpg ”ancho =” ”alto =” ”borde =” ”';
Una vez que se define el vector y se asignan los valores de cadena, el script ejecuta la función Math.random para generar un número aleatorio de 0 a 0.999. Multiplicando este valor aleatorio por el número constante 3 obtenemos un número aleatorio de 0 a 2. El resultado de esta expresión matemática finalmente se redondea usando la función Math.floor. De esta forma obtenemos un número entero aleatorio (sin coma). Por lo tanto, la variable ran asumirá el número 0, el número 1 o el número 2 como su valor cada vez que se recargue la página web.
ran = Math.floor (3 * Math.random ());
Para concluir el guión, veamos cómo usar este valor aleatorio para mostrar una imagen en lugar de otra. La etiqueta se muestra en la última declaración. junto con el elemento de la variable img [] relativo al número aleatorio (0, 1 o 2) asumido por la variable corrió.
document.write ("");
A modo de ejemplo práctico, si el número aleatorio de la variable corrida fuera igual a 1, el script tomará en consideración los parámetros contenidos en la variable string img [1], publicando la imagen foto2.jpg en pantalla.
