cara efek bintang bertaburan pada blog

setiap kali  kita share buka blog kadang kita menemukan suatu kursor yang apabila kita gerakkan akan muncul seperti bintang berjatuhan,,

       disini saya akan coba memberi tahu langkah2nya.. okay langsung jja ke tkp;


login ke akun blogger,
klik Rancangan (tata letak) tambah gadget dimana aja terserah kamu
pilih yang HTML/javascript
terus copy paste kode berikut ini;

<script type="text/javascript"> </p> <p> // <![CDATA[</p> <p> var colour="#52D8ED";</p> <p> var sparkles=100;</p> <p> var x=ox=400;</p> <p> var y=oy=300;</p> <p> var swide=800;</p> <p> var shigh=600;</p> <p> var sleft=sdown=0;</p> <p> var tiny=new Array();</p> <p> var star=new Array();</p> <p> var starv=new Array();</p> <p> var starx=new Array();</p> <p> var stary=new Array();</p> <p> var tinyx=new Array();</p> <p> var tinyy=new Array();</p> <p> var tinyv=new Array();</p> <p> window.onload=function() { if (document.getElementById) {</p> <p> var i, rats, rlef, rdow;</p> <p> for (var i=0; i<sparkles; i++) {</p> <p> var rats=createDiv(3, 3);</p> <p> rats.style.visibility="hidden";</p> <p> document.body.appendChild(tiny[i]=rats);</p> <p> starv[i]=0;</p> <p> tinyv[i]=0;</p> <p> var rats=createDiv(5, 5);</p> <p> rats.style.backgroundColor="transparent";</p> <p> rats.style.visibility="hidden";</p> <p> var rlef=createDiv(1, 5);</p> <p> var rdow=createDiv(5, 1);</p> <p> rats.appendChild(rlef);</p> <p> rats.appendChild(rdow);</p> <p> rlef.style.top="3px";</p> <p> rlef.style.left="0px";</p> <p> rdow.style.top="0px";</p> <p> rdow.style.left="3px";</p> <p> document.body.appendChild(star[i]=rats);</p> <p> }</p> <p> set_width();</p> <p> sparkle();</p> <p> }}</p> <p> function sparkle() {</p> <p> var c;</p> <p> if (x!=ox || y!=oy) {</p> <p> ox=x;</p> <p> oy=y;</p> <p> for (c=0; c<sparkles; c++) if (!starv[c]) {</p> <p> star[c].style.left=(starx[c]=x)+"px";</p> <p> star[c].style.top=(stary[c]=y)+"px";</p> <p> star[c].style.clip="rect(0px, 5px, 5px, 0px)";</p> <p> star[c].style.visibility="visible";</p> <p> starv[c]=50;</p> <p> break;</p> <p> }</p> <p> }</p> <p> for (c=0; c<sparkles; c++) {</p> <p> if (starv[c]) update_star(c);</p> <p> if (tinyv[c]) update_tiny(c);</p> <p> }</p> <p> setTimeout("sparkle()", 40);</p> <p> }</p> <p> function update_star(i) {</p> <p> if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";</p> <p> if (starv[i]) {</p> <p> stary[i]+=1+Math.random()*3;</p> <p> if (stary[i]<shigh+sdown) {</p> <p> star[i].style.top=stary[i]+"px";</p> <p> starx[i]+=(i%5-2)/5;</p> <p> star[i].style.left=starx[i]+"px";</p> <p> }</p> <p> else {</p> <p> star[i].style.visibility="hidden";</p> <p> starv[i]=0;</p> <p> return;</p> <p> }</p> <p> }</p> <p> else {</p> <p> tinyv[i]=50;</p> <p> tiny[i].style.top=(tinyy[i]=stary[i])+"px";</p> <p> tiny[i].style.left=(tinyx[i]=starx[i])+"px";</p> <p> tiny[i].style.width="2px";</p> <p> tiny[i].style.height="2px";</p> <p> star[i].style.visibility="hidden";</p> <p> tiny[i].style.visibility="visible"</p> <p> }</p> <p> }</p> <p> function update_tiny(i) {</p> <p> if (--tinyv[i]==25) {</p> <p> tiny[i].style.width="1px";</p> <p> tiny[i].style.height="1px";</p> <p> }</p> <p> if (tinyv[i]) {</p> <p> tinyy[i]+=1+Math.random()*3;</p> <p> if (tinyy[i]<shigh+sdown) {</p> <p> tiny[i].style.top=tinyy[i]+"px";</p> <p> tinyx[i]+=(i%5-2)/5;</p> <p> tiny[i].style.left=tinyx[i]+"px";</p> <p> }</p> <p> else {</p> <p> tiny[i].style.visibility="hidden";</p> <p> tinyv[i]=0;</p> <p> return;</p> <p> }</p> <p> }</p> <p> else tiny[i].style.visibility="hidden";</p> <p> }</p> <p> document.onmousemove=mouse;</p> <p> function mouse(e) {</p> <p> set_scroll();</p> <p> y=(e)?e.pageY:event.y+sdown;</p> <p> x=(e)?e.pageX:event.x+sleft;</p> <p> }</p> <p> function set_scroll() {</p> <p> if (typeof(self.pageYOffset)=="number") {</p> <p> sdown=self.pageYOffset;</p> <p> sleft=self.pageXOffset;</p> <p> }</p> <p> else if (document.body.scrollTop || document.body.scrollLeft) {</p> <p> sdown=document.body.scrollTop;</p> <p> sleft=document.body.scrollLeft;</p> <p> }</p> <p> else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {</p> <p> sleft=document.documentElement.scrollLeft;</p> <p> sdown=document.documentElement.scrollTop;</p> <p> }</p> <p> else {</p> <p> sdown=0;</p> <p> sleft=0;</p> <p> }</p> <p> }</p> <p> window.onresize=set_width;</p> <p> function set_width() {</p> <p> if (typeof(self.innerWidth)=="number") {</p> <p> swide=self.innerWidth;</p> <p> shigh=self.innerHeight;</p> <p> }</p> <p> else if (document.documentElement && document.documentElement.clientWidth) {</p> <p> swide=document.documentElement.clientWidth;</p> <p> shigh=document.documentElement.clientHeight;</p> <p> }</p> <p> else if (document.body.clientWidth) {</p> <p> swide=document.body.clientWidth;</p> <p> shigh=document.body.clientHeight;</p> <p> }</p> <p> }</p> <p> function createDiv(height, width) {</p> <p> var div=document.createElement("div");</p> <p> div.style.position="absolute";</p> <p> div.style.height=height+"px";</p> <p> div.style.width=width+"px";</p> <p> div.style.overflow="hidden";</p> <p> div.style.backgroundColor=colour;</p> <p> return (div);</p> <p> }</p> <p> // ]]></p> <p> </script><br />

   

terus disave yah,, next lihat blog. . .
yupzz yang tulisan warna merah diatas yaitu warna efek bintangnya,,bisa kamu ganti sesuai keinginan kamu,
untuk cari tahu kode warna kamu, tanya ja ma mbah google, wkwkwk

sekian thankz...