Este artigo descreve o método de alternar aleatoriamente imagens de fundo no JS. Compartilhe para sua referência. O método de implementação específico é o seguinte:
Primeiro de tudo, você precisa preparar algumas imagens. O tamanho da imagem (seja tamanho ou tamanho de dados) deve ser bem controlado. Se for muito grande, tornará o usuário incapaz de esperar para ver a imagem completa e pular. Se for muito pequeno, afetará a qualidade da página.
Porce essas imagens em uma matriz no script para facilitar a chamada. A duração da matriz é obviamente o número de imagens.
Copie o código da seguinte forma: var bodbgs = []; // Crie uma variável de matriz para armazenar o caminho para a imagem de fundo
bodybgs [0] = "Images/01.jpg";
bodybgs [1] = "imagens/02.jpg";
bodybgs [2] = "imagens/03.jpg";
bodybgs [3] = "imagens/04.jpg";
bodybgs [4] = "imagens/05.jpg";
Como 5 imagens são usadas acima, um número aleatório de 0 a 4 precisa ser gerado aqui. Se o comprimento da matriz for diferente, basta modificar o multiplicador no código a seguir.
A cópia do código é a seguinte: var randombgindex = math.round (math.random () * 4);
Estes são os programas principais. Embora seja muito simples, é uma pequena ideia. Se você usar isso como base, algumas funções estendidas podem ser feitas através do processamento. Por exemplo: comutação de tópicos e outras apresentações aleatórias, etc. Abaixo está o código JS completo.
Copie o código da seguinte forma: <script type = "text/javascript">
// <! CDATA [
var bodybgs = [];
bodybgs [0] = "Images/01.jpg";
bodybgs [1] = "imagens/02.jpg";
bodybgs [2] = "imagens/03.jpg";
bodybgs [3] = "imagens/04.jpg";
bodybgs [4] = "imagens/05.jpg";
var Randombgindex = Math.Round (Math.random () * 4);
// emitir uma imagem de fundo aleatória
document.write ('<yoy> corpo {background: url (' + bodybgs [randombgindex] + ') sem repetir 50% 0} </style>');
//]]>
</script>
Espero que a descrição deste artigo seja útil para a programação da Web de todos com base no JavaScript.