|
論壇說明 |
歡迎您來到『史萊姆論壇』 ^___^ 您目前正以訪客的身份瀏覽本論壇,訪客所擁有的權限將受到限制,您可以瀏覽本論壇大部份的版區與文章,但您將無法參與任何討論或是使用私人訊息與其他會員交流。若您希望擁有完整的使用權限,請註冊成為我們的一份子,註冊的程序十分簡單、快速,而且最重要的是--註冊是完全免費的! 請點擊這裡:『註冊成為我們的一份子!』 |
|
主題工具 | 顯示模式 |
2004-12-22, 02:54 AM | #1 (permalink) |
榮譽會員
|
論壇頁面的雪花效果如何實現的?
Q:
論壇頁面的雪花效果如何實現的? 下雪的感覺真好!要是會左右漂就更好一點..... 哪位能貼個程式碼上來? A: 先來一別人的.. <script type="text/javascript"> // 程式作者:風痕影(hit1205@m70.url.com.tw) // 作者網站:風痕水影(http://student.clhs.tyc.edu.tw/~s010815) // 製作日期:2004年11月15-17日 n=6; // 雪花數目 wind=0; // 風力 re=60; // 更新 vy=4; // 雪花速度 vx=4; // 搖晃程度 img="http://dob.tnc.edu.tw/authorHD/1/snow.gif"; // 圖檔 img_h=30; // 雪花高 h=250; // 效果範圍高 w=300; // 效果範圍寬 for(i=0;i<n;i++){document.write("<div id=\"snow"+i+"\" style=\"position:absolute;z-index:"+i+";top:-"+(Math.random()*h+img_h)+"px;left:"+Math.random()*(w-img_h)+"px;\"><img src=\""+img+"\" border=\"0\"></div>");} function snow(){ for(i=0;i<n;i++){ dgs=document.getElementById("snow"+i).style; if((parseInt(dgs.top)<h)&&(parseInt(dgs.left)<w)&&(parseInt(dgs.left)>-img_h)){ if(Math.round(Math.random())==1){o=1;}else{o=-1;} dgs.top=parseInt(dgs.top)+vy+"px"; dgs.left=parseInt(dgs.left)+Math.random()*vx*o+wind+"px"; } else{ dgs.top=-(Math.random()*h+img_h); dgs.left=Math.random()*(w-img_h); } } setTimeout("snow();",re); } </script> ======================================== 再一例............... <SCRIPT language=javascript src="/xmas.js"></SCRIPT> http://bbs.sloime2.com.tw/xmas.js xmas.js document.write('<style>.drop { position: absolute; width: 3; filter: flipV(), flipH(); font-size: 40;color: blue }</style>'); snow = true; snowsym = " * " rainsym = " ' " howmany = 10 if(snow){sym = snowsym; speed=1; angle=10; drops=howmany} else{sym = rainsym; speed=50; drops=howmany; angle=6} movex = -speed/angle; movey = speed; count = 0; function moverain(){ for(move = 0; move < drops; move++){ xx[move]+=movex; yy[move]+=mv[move]; hmm = Math.round(Math.random()*1); if(xx[move] < 0){xx[move] = maxx+10;} if(yy[move] > maxy){yy[move] = 10;} drop[move].left = xx[move] drop[move].top = yy[move]+document.body.scrollTop; }setTimeout('moverain()','1')} if (document.all){ drop = new Array(); xx = new Array(); yy = new Array(); mv = new Array() ly = "document.all['"; st = "'].style" for(make = 0; make < drops; make++){ document.write('<div id="drop'+make+'" class=drop>'+sym+'</div>'); drop[make] = eval(ly+'drop'+make+st); maxx = document.body.clientWidth-40 maxy = document.body.clientHeight-40 xx[make] = Math.random()*maxx; yy[make] = -100-Math.random()*maxy; drop[make].left = xx[make] drop[make].top = yy[make] mv[make] = (Math.random()*5)+speed/4; drop[make].fontSize = (Math.random()*10)+20; if(snow){col = 'white'}else{col = 'blue'} drop[make].color = col; } window.onload=moverain } ======================= 直接加...雪花就是字串「*」,怕吃記憶體cpu資源的話!user頁面內容過濾裡增加*/xmas.js可以過濾掉。 <SCRIPT language=javascript> document.write('<style>.drop { position: absolute; width: 3; filter: flipV(), flipH(); font-size: 40;color: blue }</style>'); snow = true; snowsym = " * " rainsym = " ' " howmany = 10 if(snow){sym = snowsym; speed=1; angle=10; drops=howmany} else{sym = rainsym; speed=50; drops=howmany; angle=6} movex = -speed/angle; movey = speed; count = 0; function moverain(){ for(move = 0; move < drops; move++){ xx[move]+=movex; yy[move]+=mv[move]; hmm = Math.round(Math.random()*1); if(xx[move] < 0){xx[move] = maxx+10;} if(yy[move] > maxy){yy[move] = 10;} drop[move].left = xx[move] drop[move].top = yy[move]+document.body.scrollTop; }setTimeout('moverain()','1')} if (document.all){ drop = new Array(); xx = new Array(); yy = new Array(); mv = new Array() ly = "document.all['"; st = "'].style" for(make = 0; make < drops; make++){ document.write('<div id="drop'+make+'" class=drop>'+sym+'</div>'); drop[make] = eval(ly+'drop'+make+st); maxx = document.body.clientWidth-40 maxy = document.body.clientHeight-40 xx[make] = Math.random()*maxx; yy[make] = -100-Math.random()*maxy; drop[make].left = xx[make] drop[make].top = yy[make] mv[make] = (Math.random()*5)+speed/4; drop[make].fontSize = (Math.random()*10)+20; if(snow){col = 'white'}else{col = 'blue'} drop[make].color = col; } window.onload=moverain } </SCRIPT> |
送花文章: 3,
|