tutorial #15 : snow effect versi II

Okay , tuto yg nie kieym and ad sorang blogger lain request tp da lupa siapa . Okay , snow effect version II ni dye besar sikit ,nmpak comel jea kan ? hehe .cth kt blog apit ni laa ,
Okay . jom start :)
design > edit layout > add a gadjet >html javascript
and paste kod kt bawah ni okay ,
<script>

//Here you can add your own picture for snow. Just change the url
var 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;
}
else
if (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>


Ini yg color putih mcam blog apit punya , kalau nk tukar color snow tuh just tukar kan perkataan yg dibold tuh dengan snow yg kt bawah neh :)

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 then tekan save . then preview laa :)
creds : adira jamal

31 comments:

  1. wah wah! lps ni blog ada turun salji la kalau pakai tuto ni.hehe

    ReplyDelete
  2. wokey apit! thanks a lot x1000 lah!
    excited nk try ble ad free time ni, skali lagi, thanks apit! ^_^

    ReplyDelete
  3. @uwmaisarah Haha . sure thing laa , try laa k :)

    ReplyDelete
  4. @noorcahaya OMG ! owner doublelight datang komen entry laa xD

    ReplyDelete
  5. gilerrr..kalau pki tuto laen..preview xde.nih aderk pulk!btw,thx apit for the tuto

    ReplyDelete
  6. Apit, mcm mane nak buat snow ni jatuh dari betul betul dkt atas then jatuh sampai ke bawah?

    ReplyDelete
  7. @Iena
    Cuba letak code snow tuh dekat atas . :)

    ReplyDelete
  8. tumpang tanye :D cmne nk buat effect salji nie kat right ngan left ..

    ReplyDelete
  9. kenapa sye punye snow tak center betol2 ek ? Dye jadi ketepi.. Tak lawa lah.. =='

    ReplyDelete
  10. aloo , kak tika buad ta jadi ponn :(

    ReplyDelete
  11. apit , background sye kaler purple , kalo bole sye nk ltk salji nie kaler purple jugak .

    ReplyDelete
  12. apit. . .
    npe dye sparuh jew ?
    chiqa wt ada sparuh jeW . .
    blh knn jew dye ade ?

    ReplyDelete
  13. x de la pait btw tqvm semua tutriol 1

    ReplyDelete

drop your words here :)