Este exemplo de artigo descreve o método de geração aleatória de cores de fundo da Web por JS. Compartilhe para sua referência. O método de implementação específico é o seguinte:
Copie o código da seguinte forma: <html>
<head>
<Title> JS Efeitos Especiais Página gerada aleatoriamente cor de fundo </itítulo>
<Estilo>
.30pt {font-size: 30pt; cor:#de3076}
</Style>
<Script Language = "JavaScript">
<!-
color = new Array ("0", "3", "6", "9", "C", "F");
velocidade = 250;
document.bgcolor = "fffff";
bg = novo array ("ffffff", "ffffff", "ffffff");
função begin () {
document.form.col1.value = "x"; document.form.col2.value = "x";
document.form.col3.value = "x"; i = 0; rolo (velocidade);
}
Rolo de função (speedb) // rodas rolam
{
if (document.form.col1.value == "x") {
document.form.c1.value = document.form.b1.value;
document.form.b1.value = document.form.a1.value;
document.form.a1.value =
cor [Math.Round (Math.Random ()*10)%6]+
cor [Math.Round (Math.Random ()*10)%6]; // Use funções aleatórias para gerar valores de cores na roda
}
if (document.form.col2.value == "x") {
document.form.c2.value = document.form.b2.value;
document.form.b2.value = document.form.a2.value;
document.form.a2.value =
cor [Math.Round (Math.Random ()*10)%6]+
cor [Math.Round (Math.Random ()*10)%6];
}
if (document.form.col3.value == "x") {
document.form.c3.value = document.form.b3.value;
document.form.b3.value = document.form.a3.value;
document.form.a3.value =
cor [Math.Round (Math.Random ()*10)%6]+
cor [Math.Round (Math.Random ()*10)%6];
}
setTimeout ("roll ("+speedb+")", speedb);
}
função pare (col) // a roda para de rolar
{
if (col == 1) {document.form.col1.value = ""; i ++;}
if (col == 2) {document.form.col2.value = ""; i ++;}
if (col == 3) {document.form.col3.value = ""; i ++;}
if (i == 3) {
bg [0] = document.form.a1.value+
document.form.a2.value+
document.form.a3.value;
bg [1] = document.form.b1.value+
document.form.b2.value+
document.form.b3.value;
bg [2] = document.form.c1.value+
document.form.c2.value+
document.form.c3.value;
speedb = 500000; rolo (speedb);
}
}
Visualização da função (letra) // Visualização de cores
{
document.bgcolor = bg [letra];
document.form.color.value = "#"+bg [letra];
}
->
</script>
</head>
<Center>
<br> <br> <br> <br>
<nome name = "form">
<Tabela CellPadding = 2 borda = 1>
<tr> <td align = Center>
<tipo de entrada = nome do texto = "a1" size = 3 onfocus = "this.blur ()" value = "">
<Tipo de entrada = Nome do texto = "A2" Tamanho = 3 onfocus = "this.blur ()" value = "">
<entrada de entrada = name de texto = "a3" size = 3 onfocus = "this.blur ()" value = "">
<Tipo de entrada = Button OnClick = "View (0)" value = "visualize"> <br>
<Tipo de entrada = Nome do texto = "B1" Tamanho = 3 onfocus = "this.blur ()" value = "">
<Tipo de entrada = Nome do texto = "B2" Tamanho = 3 onfocus = "this.blur ()" value = "">
<Tipo de entrada = Nome do texto = "B3" Tamanho = 3 onfocus = "this.blur ()" value = "">
<Tipo de entrada = Button OnClick = "View (1)" value = "visualize"> <br>
<Tipo de entrada = Nome do texto = "C1" Tamanho = 3 onfocus = "this.blur ()" value = "">
<Tipo de entrada = Nome do texto = "C2" Tamanho = 3 onfocus = "this.blur ()" value = "">
<Tipo de entrada = Nome do texto = "C3" Tamanho = 3 onfocus = "this.blur ()" value = "">
<Tipo de entrada = Button OnClick = "View (2)" value = "visualize"> <br>
<tipo de entrada = botão onclick = "stop (1)" value = "x" name = "col1">
<Tipo de entrada = botão onclick = "Stop (2)" value = "x" name = "col2">
<tipo de entrada = botão onclick = "stop (3)" value = "x" name = "col3">
</td>
<TD Valign = Alinhamento Médio = Centro>
<Tipo de entrada = Button OnClick = "Begin ()" Value = "Iniciar!"> <p>
<Tabela BGCOLOR = FFFFF Border = 1 CellSpacacing = 0>
<tr> <td align = Center Valign = Middle> Pressione "X" e a roda para de girar ... <p>
Bg color = <Tipo de entrada = Tamanho do texto = 7 Valor = "#ffffff" Nome = cor>
</td> </tr>
</tabela>
</td> </tr>
</tabela>
</morm>
</central>
<tabela class = 30pt>
<tr> <td> geração aleatória de cor
</tr> <tr> <td> Pressione o botão Iniciar e as três fileiras de rodas à direita começam a rolar
</tr> <tr> <td> Pressione os três botões X para definir o valor da cor
</tr> <tr> <td> Pressione o botão de visualização para ver o efeito da cor
</tr>
</tabela> <p>
</Body>
</html>
Espero que este artigo seja útil para a programação JavaScript de todos.