?? 6-3.htm
字號:
<BODY><SCRIPT LANGUAGE="JavaScript">
<!--圖片的鏈接地址-->
var snowsrc="ball.gif"
<!--圖片的運動時間-->
var no = 10; <!--圖片的個數-->
var dx, xp, yp; <!--聲明變量,xp表示橫坐標,yp表示縱坐標-->
var am, stx, sty; <!--聲明變量,am表示左右擺動的幅度,stx表示橫坐標的偏移步長,sty表示縱坐標的步長-->
{
doc_width = document.body.clientWidth;<!--獲取當前窗口的寬度-->
doc_height = document.body.clientHeight;<!--獲取當前窗口的高度-->
}
dx = new Array();<!--聲明數組變量dx-->
xp = new Array();<!--聲明數組變量xp-->
yp = new Array();<!--聲明數組變量yp-->
am = new Array();<!--聲明數組變量am-->
stx = new Array();<!--聲明數組變量stx-->
sty = new Array();<!--聲明數組變量sty-->
for (i = 0; i < no; ++ i) {
dx[i] = 0;
xp[i] = Math.random()*(doc_width-50); <!--第i個圖片的橫坐標初始值-->
yp[i] = Math.random()*doc_height;<!--第i個圖片的縱坐標初始值-->
am[i] = Math.random()*20; <!--第i個圖片的左右擺動的幅度-->
stx[i] = 0.02 + Math.random()/10; <!--第i個圖片x方向的步長-->
sty[i] = 0.7 + Math.random(); <!--第i個圖片y方向的步長-->
{<!--加入一個圖片-->
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"></div>");
}
}
function snowIE() {
for (i = 0; i < no; ++ i) {
<!--第i個圖片的縱坐標加上步長-->
yp[i] += sty[i];
<!--如果新坐標超過了屏幕下沿,重置該圖片的信息,包括橫坐標、縱坐標以及x方向的步長和y方向的步長-->
if (yp[i] > doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);<!--重新賦值圖片的橫坐標-->
yp[i] = 0;<!--重新賦值圖片的縱坐標-->
}
dx[i] += stx[i];<!--dx變量加上一個步長-->
document.all["dot"+i].style.pixelTop = yp[i];<!--更新圖片的縱坐標-->
document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);<!--更新圖片的橫坐標-->
}
<!--設定動畫刷新的時間周期-->
setTimeout("snowIE()", 10);
}
<!--調用snowIE()函數-->
snowIE();
</script>
<!--本例程完成了隨意飄動的圖像的設計-->
<!--設計的過程中,根據用戶不同的瀏覽器分別給出了相應的動畫函數-->
<!--圖像飄動的過程中,橫坐標的軌跡是以一點為中心的正弦曲線-->
<!--利用了setTimeout函數完成了動畫的功能-->
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -