流星雨
這網頁背景就是效果。
<SCRIPT LANGUAGE="JavaScript"> <!-- Begin var no = 20;//數量 var speed = 5;//落下的速度 var ns4up = (document.layers) ? 1 : 0; var ie4up = (document.all) ? 1 : 0; var s, x, y, sn, cs; var a, r, cx, cy; var i, doc_width = 800, doc_height = 600; if (ns4up) { doc_width = self.innerWidth; doc_height = self.innerHeight; } else if (ie4up) { doc_width = document.body.clientWidth; doc_height = document.body.clientHeight; } x = new Array(); y = new Array(); r = new Array(); cx = new Array(); cy = new Array(); s = 8; for (i = 0; i < no; ++ i) { initsnow(); if (ns4up) { if (i == 0) { document.write("<layer name=\"dot"+ i +"\" left=\"1\" "); document.write("top=\"1\" visibility=\"show\"><font size=1 color=\"yellow\">"); document.write("★</font></layer>");//在Netscape出現的樣式 } else { document.write("<layer name=\"dot"+ i +"\" left=\"1\" "); document.write("top=\"1\" visibility=\"show\"><font size=1 color=\"yellow\">"); document.write("★</font></layer>"); } } else if (ie4up) { if (i == 0) { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: "); document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: "); document.write("visible; TOP: 15px; LEFT: 15px;\"><font size=1 color=\"yellow\">"); document.write("★</font></div>");//在IE出現的樣式 } else { document.write("<div id=\"dot"+ i +"\" style=\"POSITION: "); document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: "); document.write("visible; TOP: 15px; LEFT: 15px;\"><font size=1 color=\"yellow\">"); document.write("★</font></div>"); } } } function initsnow() { 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 makesnow() { 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]; } function updatesnow() { r[i] += s; x[i] = r[i] * sn + cx[i]; y[i] = r[i] * cs + cy[i]; } function snowdropNS() { for (i = 0; i < no; ++ i) { updatesnow(); if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) { makesnow(); doc_width = self.innerWidth; doc_height = self.innerHeight; } document.layers["dot"+i].top = y[i]; document.layers["dot"+i].left = x[i]; } setTimeout("snowdropNS()", speed); } function snowdropIE() { for (i = 0; i < no; ++ i) { updatesnow(); if ((x[i] <= 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) { makesnow(); 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("snowdropIE()", speed); } if (ns4up) { snowdropNS(); } else if (ie4up) { snowdropIE(); } // End --> </script>
bgcolor="#000000"