ตัวอย่างบทความนี้อธิบายวิธีการสร้างสีพื้นหลังของเว็บแบบสุ่มโดย JS แบ่งปันสำหรับการอ้างอิงของคุณ วิธีการใช้งานเฉพาะมีดังนี้:
คัดลอกรหัสดังนี้: <html>
<head>
<title> เอฟเฟกต์พิเศษ JS ที่สร้างขึ้นแบบสุ่มหน้าพื้นหลังสีพื้นหลัง </title>
<style>
.30pt {ตัวอักษรขนาด: 30pt; สี:#de3076}
</style>
<ภาษาสคริปต์ = "JavaScript">
-
color = new Array ("0", "3", "6", "9", "C", "F");
ความเร็ว = 250;
document.bgcolor = "fffff";
bg = อาร์เรย์ใหม่ ("ffffff", "ffffff", "ffffff");
ฟังก์ชั่นเริ่มต้น () {
document.form.col1.value = "x"; document.form.col2.value = "x";
document.form.col3.value = "x"; i = 0; ม้วน (ความเร็ว);
-
ฟังก์ชันม้วน (speedb) // ล้อม้วน
-
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 =
สี [math.round (math.random ()*10)%6]+
Color [Math.Round (Math.Random ()*10)%6]; // ใช้ฟังก์ชั่นสุ่มเพื่อสร้างค่าสีบนล้อ
-
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 =
สี [math.round (math.random ()*10)%6]+
Color [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 =
สี [math.round (math.random ()*10)%6]+
Color [Math.Round (Math.Random ()*10)%6];
-
settimeout ("ม้วน ("+speedb+")", speedb);
-
ฟังก์ชั่นหยุด (col) // ล้อหยุดกลิ้ง
-
if (col == 1) {document.form.col1.value = ""; i ++;}
if (col == 2) {document.form.col2.value = ""; i ++;}
if (col == 3) {document.form.col3.value = ""; i ++;}
ถ้า (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);
-
-
ฟังก์ชั่นมุมมอง (ตัวอักษร) // ตัวอย่างสี
-
document.bgcolor = bg [ตัวอักษร];
document.form.color.value = "#"+bg [ตัวอักษร];
-
-
</script>
</head>
<enter>
<br> <br> <br> <br>
<form name = "Form">
<Table CellPadding = 2 Border = 1>
<tr> <td align = center>
<ประเภทอินพุต = ชื่อข้อความ = "a1" size = 3 onfocus = "this.blur ()" value = "">
<ประเภทอินพุต = ชื่อข้อความ = "a2" size = 3 onfocus = "this.blur ()" value = "">
<ประเภทอินพุต = ชื่อข้อความ = "a3" size = 3 onfocus = "this.blur ()" value = "">
<อินพุตประเภท = ปุ่ม onClick = "ดู (0)" value = "ดูตัวอย่าง"> <br>
<ประเภทอินพุต = ชื่อข้อความ = "b1" ขนาด = 3 onfocus = "this.blur ()" value = "">
<ประเภทอินพุต = ชื่อข้อความ = "b2" ขนาด = 3 onfocus = "this.blur ()" value = "">
<ประเภทอินพุต = ชื่อข้อความ = "b3" ขนาด = 3 onfocus = "this.blur ()" value = "">
<อินพุตประเภท = ปุ่ม onClick = "ดู (1)" value = "ดูตัวอย่าง"> <br>
<ประเภทอินพุต = ชื่อข้อความ = "c1" size = 3 onfocus = "this.blur ()" value = "">
<ประเภทอินพุต = ชื่อข้อความ = "c2" size = 3 onfocus = "this.blur ()" value = "">
<ประเภทอินพุต = ชื่อข้อความ = "c3" size = 3 onfocus = "this.blur ()" value = "">
<อินพุตประเภท = ปุ่ม onClick = "ดู (2)" value = "ดูตัวอย่าง"> <br>
<อินพุตประเภท = ปุ่ม onclick = "หยุด (1)" value = "x" name = "col1">
<อินพุตประเภท = ปุ่ม onClick = "หยุด (2)" value = "x" name = "col2">
<อินพุตประเภท = ปุ่ม onclick = "หยุด (3)" value = "x" name = "col3">
</td>
<td valign = middle allign = center>
<อินพุตประเภท = ปุ่ม onClick = "เริ่มต้น ()" value = "เริ่มต้น!"> <p>
<ตาราง bgColor = border fffff = 1 cellspacing = 0>
<tr> <td align = center valign = middle> กด "x" และล้อหยุดหมุน ... <p>
bg color = <ประเภทอินพุต = ขนาดข้อความ = 7 value = "#ffffff" ชื่อ = color>
</td> </tr>
</table>
</td> </tr>
</table>
</form>
</enter>
<table class = 30pt>
<tr> <td> การสร้างสีแบบสุ่ม
</tr> <tr> <td> กดปุ่มเริ่มต้นและล้อสามแถวทางด้านขวาเริ่มม้วน
</tr> <tr> <td> กดปุ่มสามปุ่มเพื่อตั้งค่าสี
</tr> <tr> <td> กดปุ่มดูตัวอย่างเพื่อดูเอฟเฟกต์สี
</tr>
</table> <p>
</body>
</html>
ฉันหวังว่าบทความนี้จะเป็นประโยชน์กับการเขียนโปรแกรม JavaScript ของทุกคน