Contoh artikel ini menjelaskan metode menghasilkan warna latar belakang web secara acak oleh JS. Bagikan untuk referensi Anda. Metode implementasi spesifik adalah sebagai berikut:
Salin kode sebagai berikut: <Html>
<head>
<title> JS Efek Khusus yang Dibuat secara acak Warna latar belakang halaman web </iteme>
<tyle>
.30pt {font-size: 30pt; color:#de3076}
</tyle>
<Bahasa skrip = "javascript">
<!-
warna = array baru ("0", "3", "6", "9", "c", "f");
Kecepatan = 250;
document.bgcolor = "fffff";
bg = array baru ("ffffff", "ffffff", "ffffff");
fungsi begin () {
document.form.col1.value = "x"; document.form.col2.value = "x";
document.form.col3.value = "x"; i = 0; roll (kecepatan);
}
function roll (speedb) // roda roll
{
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 =
Warna [Math.round (Math.Random ()*10)%6]+
warna [math.round (math.random ()*10)%6]; // Gunakan fungsi acak untuk menghasilkan nilai warna pada 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 =
Warna [Math.round (Math.Random ()*10)%6]+
warna [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 =
Warna [Math.round (Math.Random ()*10)%6]+
warna [math.round (math.random ()*10)%6];
}
setTimeout ("roll ("+speedb+")", speedb);
}
function stop (col) // roda berhenti bergulir
{
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; roll (speedb);
}
}
Tampilan fungsi (huruf) // pratinjau warna
{
document.bgcolor = bg [huruf];
document.form.color.value = "#"+bg [huruf];
}
->
</script>
</head>
<senter>
<br> <br> <br> <br>
<Form name = "Form">
<tabel cellpadding = 2 border = 1>
<tr> <td align = center>
<input type = name teks = "a1" size = 3 onfocus = "this.blur ()" value = "">
<input type = name teks = "a2" size = 3 onfocus = "this.blur ()" value = "">
<input type = nama teks = "a3" size = 3 onfocus = "this.blur ()" value = "">
<input type = tombol onClick = "view (0)" value = "preview"> <br>
<input type = name teks = "b1" size = 3 onfocus = "this.blur ()" value = "">
<input type = name teks = "b2" size = 3 onfocus = "this.blur ()" value = "">
<input type = name teks = "b3" ukuran = 3 onfocus = "this.blur ()" value = "">
<input type = tombol onClick = "view (1)" value = "preview"> <br>
<input type = name teks = "c1" size = 3 onfocus = "this.blur ()" value = "">
<input type = name teks = "c2" size = 3 onfocus = "this.blur ()" value = "">
<input type = name teks = "c3" size = 3 onfocus = "this.blur ()" value = "">
<input type = tombol onclick = "Lihat (2)" value = "Preview"> <br>
<input type = tombol onclick = "stop (1)" value = "x" name = "col1">
<input type = tombol onclick = "stop (2)" value = "x" name = "col2">
<input type = tombol onclick = "stop (3)" value = "x" name = "col3">
</td>
<td valign = middle align = center>
<input type = tombol onclick = "begin ()" value = "start!"> <p>
<tabel bgcolor = border fffff = 1 cellspacing = 0>
<tr> <td align = center valign = middle> tekan "x" dan roda berhenti berbalik ... <p>
BG Color = <Input Tipe = Ukuran Teks = 7 Nilai = "#ffffff" Name = Color>
</td> </tr>
</boable>
</td> </tr>
</boable>
</form>
</penter>
<Table Class = 30PT>
<tr> <td> Generasi warna acak
</tr> <tr> <td> Tekan tombol Mulai dan tiga baris roda di sebelah kanan mulai bergulir
</tr> <tr> <td> Tekan tombol Tiga X untuk mengatur nilai warna
</tr> <tr> <td> Tekan tombol Pratinjau untuk melihat efek warna
</tr>
</able> <p>
</body>
</html>
Saya harap artikel ini akan membantu pemrograman JavaScript semua orang.