閃爍繁星
這網頁背景就是效果。
<SCRIPT LANGUAGE="JavaScript"> <!-- Beginning var starNo = 100; //設定星星數量 var starColor = new Array("#FFFFFF","#FFFF00","#00FFFF"); // 設定星星顏色 var minSize = 2; // 設定星星最小的尺寸 var maxSize = 12; // 設定星星最大的尺寸 var move = true; // 設定星星畫面是否雖要隨捲軸移動 ( 移動：true ) ( 不移動:false ) var blink = 20; // 閃爍速度 _dom=(document.all?3:(document.getElementById?1:(document.layers?2:0))); var starLay = '<SPAN id="dmy" style="position:absolute; visibility:hidden;"></SPAN>'; var starX = new Array(); var starY = new Array(); function getWindowSize() { if(_dom == 1 || _dom == 2) { win_width = self.innerWidth; win_height = self.innerHeight; } if (_dom == 3) { win_width = document.body.clientWidth; win_height = document.body.clientHeight; } } function getScrollPosX() { if (_dom == 1) return scrollX; if (_dom == 2) return pageXOffset; if (_dom == 3) return document.body.scrollLeft } function getScrollPosY() { if (_dom == 1) return scrollY; if (_dom == 2) return pageYOffset; if (_dom == 3) return document.body.scrollTop; } function showLayer(layerName){ if (_dom == 1) document.getElementById(layerName).style.visibility = "visible"; if (_dom == 2) document.layers[layerName].visibility = "show"; if (_dom == 3) document.all(layerName).style.visibility = "visible"; } function hideLayer(layerName){ if (_dom == 1) document.getElementById(layerName).style.visibility = "hidden"; if (_dom == 2) document.layers[layerName].visibility = "hide"; if (_dom == 3) document.all(layerName).style.visibility = "hidden"; } function moveLayerTo(layerName, x, y){ if (_dom == 1) { document.getElementById(layerName).style.left = x; document.getElementById(layerName).style.top = y; } if (_dom == 2) { document.layers[layerName].left = x; document.layers[layerName].top = y; } if (_dom == 3) { document.all(layerName).style.pixelLeft = x; document.all(layerName).style.pixelTop = y; } } function star() { if (_dom) { for (var s=0; s<starNo; s++) { var ran = Math.random()*blink; if (ran < 10) { timer = Math.random()*1000 setTimeout("hideLayer('star"+s+"')",timer); setTimeout("showLayer('star"+s+"')",timer+500); } if (move) moveLayerTo("star"+s,starX[s]+getScrollPosX(),starY[s]+getScrollPosY()); } setTimeout("star()",1000); } } function init() { for (var s=0; s<starNo; s++) { starX[s] = Math.floor(Math.random()*(win_width-maxSize-5)); starY[s] = Math.floor(Math.random()*(win_height-maxSize-5)); moveLayerTo("star"+s,starX[s],starY[s]); if (_dom == 3) document.all["star"+s].style.zIndex = -1; } star(); } // End --> </SCRIPT>
<SCRIPT LANGUAGE="JavaScript"> <!-- Beginning if (_dom == 1) document.writeln('<DIV style="position:relative;z-index:2">'); if (_dom == 2) document.writeln('<LAYER left="10" top="10" z-index="2">'); if (_dom == 1) document.writeln('</DIV>'); if (_dom == 2) document.writeln('</LAYER>'); getWindowSize(); for (var i=0; i<starNo; i++) { var size = Math.floor(Math.random()*(maxSize-minSize) + minSize); var ran = Math.random()*starNo; if (ran < starNo*0.1) colorNo = 2; else if (ran < starNo*0.4) colorNo = 1; else colorNo = 0; if (_dom == 1 || _dom == 3) { starLay += '<SPAN id="star' + i + '" style="position:absolute; width:' + size + 'px; left:0px; top=0px; font-size:' + size + 'px; color:' + starColor[colorNo] + '; z-index:1; visibility:visible;">★</SPAN>'; } if (_dom == 2) { if (size == 1) size = 2; starLay += '<LAYER name="star'+ i +'" left="0" top="0" z-index="1"><FONT color="' + starColor[colorNo] + '" style="font-size:' + size + 'px;">★</FONT></LAYER>\n'; } } document.writeln(starLay); init(); // End --> </SCRIPT>