Artikel ini menjelaskan metode penerapan efek latar belakang hujan dinamis yang dihasilkan oleh JavaScript. Bagikan untuk referensi Anda. Metode implementasi spesifik adalah sebagai berikut:
Salin kode sebagai berikut: <Html>
<head>
<Title> efek latar belakang hujan dinamis yang dihasilkan oleh JavaScript </iteme>
</head>
<Body bgcolor = "#fef4d2">
<senter>
<bahasa skrip = javascript>
<!-[Step1]: Berapa banyak hujan yang dapat diatur di sini->
var rainsize = 40;
<!-[Step2]: Di sini Anda dapat mengubah kecepatan hujan, nilainya besar dan kecepatannya lambat->
var speed = 10;
var x = array baru ();
var y = array baru ();
var r = array baru ();
var cx = array baru ();
var cy = array baru ();
var doc_width = document.body.clientwidth;
var doc_height = document.body.clientHeight;
untuk (i = 0; i <rainsize; ++ i) {
initrain ();
if (i == 0) {
document.write ("<div id =/" dot " + i +"/"style =/" position: ");
document.write ("Absolute; z-index:" + i + "; visibilitas:");
document.write ("visible; atas: 15px; kiri: 15px;/"> <font color =/"blue/"> ");
document.write (", </font> </div>"); }
kalau tidak {
document.write ("<div id =/" dot " + i +"/"style =/" position: ");
document.write ("Absolute; z-index:" + i + "; visibilitas:");
document.write ("visible; atas: 15px; kiri: 15px;/"> <font color =/"blue/"> ");
document.write (",. </font> </div>"); }
}
fungsi initrain () {
a = 6;
r [i] = 1;
sn = math.sin (a);
cs = math.cos (a);
cx [i] = math.random () * doc_width + 1;
cy [i] = math.random () * doc_height + 1;
x [i] = r [i] * sn + cx [i];
y [i] = cy [i];
}
function raindropie () {
untuk (i = 0; i <rainsize; ++ i) {
Updaterain ();
if ((x [i] <= 1) || (x [i]> = (doc_width - 20)) || (y [i]> = (doc_height - 20))) {
Makerain ();
doc_width = document.body.clientwidth;
doc_height = document.body.clientHeight; }
document.all ["dot"+i] .style.pixeltop = y [i];
document.all ["dot"+i] .style.pixelleft = x [i]; }
setTimeout ("Raindropie ()", Speed);
}
function updaterain () {
r [i] += 10;
x [i] = r [i] * sn + cx [i];
y [i] = r [i] * cs + cy [i];
}
function makerain () {
r [i] = 1;
cx [i] = math.random () * doc_width + 1;
cy [i] = 1;
x [i] = r [i] * sn + cx [i];
y [i] = r [i] * cs + cy [i];
}
Raindropie ();
</script>
</body>
</html>
Saya harap artikel ini akan membantu pemrograman JavaScript semua orang.