<script language="JavaScript">
var a_Colour='fff000';<!--第一個軌跡的顏色-->
var b_Colour='00ff00';<!--第二個軌跡的顏色-->
var c_Colour='ff00ff';<!--第三個軌跡的顏色-->
var Size=120;

var YDummy=new Array(),XDummy=new Array(),xpos=0,ypos=0,ThisStep=0;step=0.6;
document.all<!--如果是ie瀏覽器-->
{
function ieMouse(){
xpos = document.body.scrollLeft+event.x+6;<!--獲得現(xiàn)在鼠標的橫坐標-->
ypos = document.body.scrollTop+event.y+16;<!--獲得現(xiàn)在鼠標的縱坐標-->
}
document.onmousemove = ieMouse;
}

function swirl(){
for (i = 0; i < 3; i++)<!--依次處理三個軌跡-->
 { 
 YDummy[i]=ypos+Size*Math.sin((1*Math.sin((ThisStep)/10))+i*2)*Math.sin((ThisStep)/4);<!--計算得到第i個軌跡上每一點的橫坐標-->
 XDummy[i]=xpos+Size*Math.cos((1*Math.sin((ThisStep)/10))+i*2)*Math.sin((ThisStep)/4);<!--計算得到第i個軌跡上每一點的縱坐標-->
 }
ThisStep+=step;
setTimeout('swirl()',10);<!--周期性調(diào)用swirl函數(shù)-->
}

var amount=10;
if ( document.all){<!--如果是ie瀏覽器-->
document.write('<div id="ODiv" style="position:absolute;top:0px;left:0px">'
+'<div id="IDiv" style="position:relative">');
for (i = 0; i < amount; i++)<!--依次處理每一個點-->
{
document.write('<div id=x style="position:absolute;top:0px;left:0px;width:'+i/2+';height:'+i/2+';background:'+a_Colour+';font-size:'+i/2+'"></div>');<!--第一個軌跡所在的頁面-->
document.write('<div id=y style="position:absolute;top:0px;left:0px;width:'+i/2+';height:'+i/2+';background:'+b_Colour+';font-size:'+i/2+'"></div>');<!--第二個軌跡所在的頁面-->
document.write('<div id=z style="position:absolute;top:0px;left:0px;width:'+i/2+';height:'+i/2+';background:'+c_Colour+';font-size:'+i/2+'"></div>');<!--第三個軌跡所在的頁面-->
}
document.write('</div></div>');
}
function prepos(){

var msie=document.all;<!--獲得ie瀏覽器的當前頁面-->
if(document.all){<!--如果是ie瀏覽器-->
for (i = 0; i < amount; i++)<!--依次處理每一個點-->
{
 if (i < amount-1) <!--對于前amount－1個點-->
 {
 msie.x[i].style.top=msie.x[i+1].style.top;msie.x[i].style.left=msie.x[i+1].style.left;<!--更新第一個軌跡上各個點上的上邊界和左邊界-->
 msie.y[i].style.top=msie.y[i+1].style.top;msie.y[i].style.left=msie.y[i+1].style.left;<!--更新第二個軌跡上各個點上的上邊界和左邊界-->
 msie.z[i].style.top=msie.z[i+1].style.top;msie.z[i].style.left=msie.z[i+1].style.left;<!--更新第三個軌跡上各個點上的上邊界和左邊界-->
 } 
else 
 {
 msie.x[i].style.top=YDummy[0];msie.x[i].style.left=XDummy[0];<!--更新第一個軌跡上最后一個點上的上邊界和左邊界-->
 msie.y[i].style.top=YDummy[1];msie.y[i].style.left=XDummy[1];<!--更新第二個軌跡上最后一個點上的上邊界和左邊界-->
 msie.z[i].style.top=YDummy[2];msie.z[i].style.left=XDummy[2];<!--更新第三個軌跡上最后一個點上的上邊界和左邊界-->
 }
}
}
setTimeout("prepos()",10);<!--周期性調(diào)用prepos函數(shù)-->
}
function Start(){<!--開始函數(shù)-->
swirl(),prepos()<!--依次調(diào)用swirl和prepos函數(shù)-->
}
window.onload=Start;<!--調(diào)用start函數(shù)-->

</script>


<!--本例程實現(xiàn)了跟著鼠標的煙花的效果-->
<!--對確定的動畫軌跡的實現(xiàn)方法-->
<!--程序?qū)Σ煌瑸g覽器的支持-->
<!--動畫的實現(xiàn)方法-->