Este artículo describe el método para cambiar aleatoriamente las imágenes de fondo en JS. Compártelo para su referencia. El método de implementación específico es el siguiente:
En primer lugar, debe preparar algunas imágenes. El tamaño de la imagen (ya sea tamaño o tamaño de datos) debe controlarse bien. Si es demasiado grande, hará que el usuario no pueda esperar para ver la imagen completa y saltar. Si es demasiado pequeño, afectará la calidad de la página.
Porce estas imágenes en una matriz en script para una fácil llamada. La longitud de la matriz es, por supuesto, el número de imágenes.
Copie el código de la siguiente manera: var corporalBGS = []; // Crear una variable de matriz para almacenar la ruta a la imagen de fondo
BodyBgs [0] = "Images/01.jpg";
BodyBGS [1] = "Images/02.jpg";
BodyBGS [2] = "Images/03.jpg";
BodyBGS [3] = "Images/04.jpg";
BodyBGS [4] = "Images/05.jpg";
Debido a que 5 imágenes se usan arriba, se debe generar un número aleatorio de 0 a 4 aquí. Si la longitud de la matriz es diferente, simplemente modifique el multiplicador en el siguiente código.
La copia del código es la siguiente: var randombgindex = math.round (math.random () * 4);
Estos son los programas centrales. Aunque es muy simple, es una pequeña idea. Si usa esto como base, se pueden realizar algunas funciones extendidas a través del procesamiento. Por ejemplo: el cambio de tema y otras presentaciones aleatorias, etc. a continuación se muestra el código JS completo.
Copie el código de la siguiente manera: <script type = "text/javaScript">
// <! Cdata [
var corporalBGS = [];
BodyBgs [0] = "Images/01.jpg";
BodyBGS [1] = "Images/02.jpg";
BodyBGS [2] = "Images/03.jpg";
BodyBGS [3] = "Images/04.jpg";
BodyBGS [4] = "Images/05.jpg";
var randombgindex = Math.round (Math.random () * 4);
// emitir una imagen de fondo aleatoria
document.write ('<style> Body {Background: URL (' + BodyBGS [RandombGindex] + ') No-Repeat 50% 0} </style>');
//]]>
</script>
Espero que la descripción en este artículo sea útil para la programación web de todos basada en JavaScript.