Tutorial : Snow Effect.

Hey. So, macam mane first day sekolah hari nieh ? Okay tak. Mesti lah okay kan. Lain lah aina. Hmm, takdek semangat langsung nak belajar dekat sekolah tadi. Rase mengantuk sangat-sangat. Lepas tuh, best friends aina pulak takdek. Lagi lah takdek semangat nak belajar. Umm, tak sah kalau tak berborak dengan dye satu hari.
Okay, never mind. Lupekan cerita tadi. Hari nieh aina nak buat tutorial yang direquestkan oleh kawan aina, Mieyra. Semalam dye hantar chat dekat aina, suruh aina buat tutorial nieh. Tapi aina dah penat sangat buat 3 tutorial. So, aina decided nak buat hari nieh. Agak rajin sikit. * belajar malas. Hee, jom kite mule.
Dashboard > Design > Add a Gadget > Html/JavaScript
Copy code bawah nieh and anda paste dekat html/javascript.
<script>
//Here you can add your own picture for snow. Just change the urlvar snowsrc="http://i13.servimg.com/u/f13/11/52/70/02/snowba10.png"//how many snowflakes there will be (currently 12)var no =40;//How fast will the snow disappear (0 is never)var hidesnowtime = 0;//The height the snow will reach before it disappears ("windowheight" or "pageheight")var snowdistance = "pageheight";///////////////////////////////End of Settings///////////////////////////////////var ie4up = (document.all) ? 1 : 0;var ns6up = (document.getElementById&&!document.all) ? 1 : 0;
function iecompattest(){return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body}
var dx, xp, yp;var am, stx, sty;var i, doc_width = 800, doc_height = 600;
if (ns6up){doc_width = self.innerWidth;doc_height = self.innerHeight;}elseif (ie4up){doc_width = document.body.clientWidth;doc_height = document.body.clientHeight;}
dx = new Array();xp = new Array();yp = new Array();am = new Array();stx = new Array();sty = new Array();
for (i = 0; i < no; ++ i){dx[i] = 0;xp[i] = Math.random()*(doc_width-50);yp[i] = Math.random()*doc_height;am[i] = Math.random()*20;stx[i] = 0.02 + Math.random()/10;sty[i] = 0.7 + Math.random();if (ie4up||ns6up){if (i == 0){document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://rftactical.darkbb.com/index.htm\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>");}else{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_NS6(){doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;for (i = 0; i < no; ++ i){yp[i] += sty[i];if (yp[i] > doc_height-50){xp[i] = Math.random()*(doc_width-am[i]-30);yp[i] = 0;stx[i] = 0.02 + Math.random()/10;sty[i] = 0.7 + Math.random();}dx[i] += stx[i];document.getElementById("dot"+i).style.top=yp[i]+"px";document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";}snowtimer=setTimeout("snowIE_NS6()", 10);}
function hidesnow(){if (window.snowtimer) clearTimeout(snowtimer)for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"}

if (ie4up||ns6up){snowIE_NS6();if (hidesnowtime>0)setTimeout("hidesnow()", hidesnowtime*1000)}</script>
Lepas tuh, anda nampak tak tulisan yang aina dah bold kan dengan color biru tuh ? Haa, yang tuh code snow warna putih tau. Kalau nak color lain pun ade jugak.
hitam
http://i905.photobucket.com/albums/ac251/bigadira95/snowhitam.png
pink/merah
http://i905.photobucket.com/albums/ac251/bigadira95/snowmerah.png
biru
http://i905.photobucket.com/albums/ac251/bigadira95/snowbiru.png
Okay, dah siap. Tekan save dan lihat hasilnye. Selamat mencuba :)
credit to : Apit

4 comments: