?? 5-23.htm
字號:
<script language="JavaScript">
var speed=25,divTop=0,divLeft=0,angle=0,ypos=0,xpos=0,amount=13;<!--定義變量-->
if (document.layers){<!--如果是netscape瀏覽器-->
for (i = 0; i < amount; i++)<!--依次對每一個流星進行處理-->
{document.write('<layer name=nsa'+i+' top=0 left=0 width='+i/3+' height='+i/3+' bgcolor=#000000></layer>');}<!--畫每一個流星所在的層-->
window.captureEvents(Event.MOUSEMOVE);<!--映射鼠標移動事件到函數-->
function nsMouse(evnt){<!--鼠標響應函數-->
xpos=evnt.pageX;ypos=evnt.pageY;<!--獲取鼠標移動的量-->
}
window.onMouseMove = nsMouse;<!--設置鼠標移動響應函數-->
}
else if (document.all){<!--如果是ie瀏覽器-->
document.write('<div style="position:absolute;top:0px;left:0px">');
document.write('<div style="position:relative">');
for (i = 0; i < amount; i++)<!--依次對每一個流星進行處理-->
{document.write('<div id=k style="position:absolute;top:0px;left:0px;width:'+i/3+';height:'+i/3+';background:#000000;font-size:'+i/3+'"></div>')}
document.write('</div></div>');<!--畫每一個流星所在的層-->
<!--鼠標響應函數-->
function iMouse(){xpos=event.x;ypos=document.body.scrollTop+event.y}<!--獲取鼠標移動的量-->
document.onmousemove = iMouse;<!--設置鼠標移動響應函數-->
}
function getAngle(){<!--獲得角度-->
Y = ypos - divTop;X = xpos - divLeft;angle = Math.round(Math.atan2(Y,X) * 180/Math.PI);<!--計算移動的路徑-->
if (angle < 0)angle += 360;<!--如果角度小于0,則加入360度-->
}
function bomb(){
if (document.layers){<!--如果是netscape瀏覽器-->
Yscroll=window.pageYOffset;<!--獲得當前窗口的縱坐標-->
ybase=Math.round(Math.random()*window.innerHeight);<!--隨機生成y值-->
xbase=Math.round(Math.random()*window.innerWidth);<!--隨機生成x值-->
yybase=window.innerHeight-10;xxbase=window.innerWidth-10;<!--獲得當前窗口的高度、寬度-->
}
else if (document.all){<!--如果是ie瀏覽器--><!--獲得當前窗口的橫坐標-->
Yscroll=document.body.scrollTop;
ybase=Math.round(Math.random()*window.document.body.offsetHeight);<!--隨機生成y值-->
xbase=Math.round(Math.random()*window.document.body.offsetWidth);<!--隨機生成x值-->
xxbase=window.document.body.offsetWidth-10;yybase=window.document.body.offsetHeight-10;<!--獲得當前窗口的高度、寬度-->
}
if ((xbase > 10 && xbase < xxbase) && (ybase > 10 && ybase < yybase))<!--生成下一個點-->
bomb();
else
{
if ((divLeft > xpos-speed/1.5) && (divLeft < xpos+speed/1.5) && (divTop >= ypos-speed/1.5) && (divTop <= ypos+speed/1.5))<!--判斷流星的位置-->
{divTop=ybase+Yscroll;divLeft=xbase}
y = Math.round(speed*Math.sin(angle*Math.PI/180));x = Math.round(speed*Math.cos(angle*Math.PI/180));<!--根據運行軌跡獲得坐標值-->
divTop+=y;divLeft+=x;<!--更新橫、縱坐標-->
getAngle();<!--調用getangle函數-->
T=setTimeout('bomb()',20);<!--周期性調用settimeout函數-->
}
}
function Split(){
Clrs=new Array('ff0000','00ff00','0000ff')<!--定義三種顏色-->
var ntscp=document.layers,msie=document.all;<!--定義變量用來區分ie和netscape-->
if (document.layers){<!--如果是netscape瀏覽器-->
for (i = 0; i < amount; i++)
{
if (i < amount-1)<!--對前面的amount-1個流星-->
{ntscp['nsa'+i].top=ntscp['nsa'+(i+1)].top;ntscp['nsa'+i].left=ntscp['nsa'+(i+1)].left}
else <!--對于最后一個流星-->
{ntscp['nsa'+i].top=divTop;ntscp['nsa'+i].left=divLeft}
}
}
else if (document.all){<!--如果是ie瀏覽器-->
for (i = 0; i < amount; i++)
{
if (i < amount-1) <!--對前面的amount-1個流星-->
{msie.k[i].style.top=msie.k[i+1].style.top;msie.k[i].style.left=msie.k[i+1].style.left} <!--依次顯示-->
else <!--對于最后一個流星-->
{msie.k[i].style.top=divTop;msie.k[i].style.left=divLeft}<!--顯示最后一個-->
}
}
for (i=0; i < amount-1; i++)<!--依次對每一個流星進行處理-->
{
for (n=0; n < Clrs.length; n++)
{var x=Math.round(Math.random()*n)}<!--隨機產生顏色-->
if (document.layers){ntscp['nsa'+i].bgColor=Clrs[x]}<!--netscape中顯示顏色-->
else if (document.all){msie.k[i].style.background=Clrs[x]}<!--ie中顯示顏色-->
}
setTimeout("Split()",2);<!--循環調用split函數-->
}
function StArT(){
bomb();<!--調用bomb函數-->
Split()<!--調用split函數-->
}
window.onload=StArT;<!--直接調用start函數-->
</script>
<!--本例程實現了跟隨鼠標的流星的效果-->
<!--對固定軌跡的坐標的實現-->
<!--顏色的隨機變化-->
<!--動畫效果的具體實現方法-->
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -