Membuat Efek Gelembung di Blog [./3r0r-c0d3] rwxr-xr-x 0 10:03:00 PM

Title	Membuat Efek Gelembung di Blog
Permission	rw-r--r--
Author	[./3r0r-c0d3]
Date and Time	10:03:00 PM
Category
Share

Assalamu'alaikum sahabat...
kali ini saya akan postingkan tentang Membuat Efek Gelembung di Blog, langsung saja Copas script di bawah ini, Masuk rancangan Klik elemen laman lalu tambah Gadget dan pilih HTML/JavaScript Copy dan paste kode dibawah ini pada gadget tersebut :

<script type="text/javascript"> // <![CDATA[ var colours=new Array("#a6f", "#60f", "#60f", "#a6f", "#ccc"); // colours for top, right, bottom and left borders and background of bubbles var bubbles=66; // how many bubbles are moving at any given time /**************************** * JavaScript Bubble Bath * * (c) 2010 mf2fm web-design * * http://www.mf2fm.com/rv * * DON'T EDIT BELOW THIS BOX * ****************************/ var swide=800; var shigh=600; var bubb=new Array(); var bubbx=new Array(); var bubby=new Array(); var bubbs=new Array(); var boddie; window.onload=function() { if (document.getElementById) { var i, rats, div; boddie=document.createElement("div"); boddie.style.position="fixed"; boddie.style.top="0px"; boddie.style.left="0px"; boddie.style.overflow="visible"; boddie.style.width="1px"; boddie.style.height="1px"; boddie.style.backgroundColor="transparent"; document.body.appendChild(boddie); set_width(); var rats, div; for (var i=0; i<bubbles; i++) { rats=createDiv("3px", "3px"); div=createDiv("auto", "auto"); rats.appendChild(div); div=div.style; div.top="1px"; div.left="0px"; div.bottom="1px"; div.right="0px"; div.borderLeft="1px solid "+colours[3]; div.borderRight="1px solid "+colours[1]; div=createDiv("auto", "auto"); rats.appendChild(div); div=div.style; div.top="0px"; div.left="1px"; div.right="1px"; div.bottom="0px" div.borderTop="1px solid "+colours[0]; div.borderBottom="1px solid "+colours[2]; div=createDiv("auto", "auto"); rats.appendChild(div); div=div.style; div.left="1px"; div.right="1px"; div.bottom="1px"; div.top="1px"; div.backgroundColor=colours[4]; div.opacity=0.5; if (document.all) div.filter="alpha(opacity=50)"; boddie.appendChild(rats); bubb[i]=rats.style; } bubble(); }} function bubble() { var c; for (c=0; c<bubbles; c++) if (!bubby[c] && Math.random()<0.333) { bubb[c].left=(bubbx[c]=Math.floor(swide/6+Math.random()*swide/1.5)-10)+"px"; bubb[c].top=(bubby[c]=shigh)+"px"; bubb[c].width="3px"; bubb[c].height="3px" bubb[c].visibility="visible"; bubbs[c]=3; break; } for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c); setTimeout("bubble()", 40); } function update_bubb(i) { if (bubby[i]) { bubby[i]-=bubbs[i]/2+i%2; if (bubby[i]>0) { if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) { bubb[i].width=bubbs[i]+"px"; bubb[i].height=bubbs[i]+"px"; } bubb[i].top=bubby[i]+"px"; bubbx[i]+=(i%5-2)/5; bubb[i].left=bubbx[i]+"px"; } else { bubb[i].visibility="hidden"; bubby[i]=0; return; } } } window.onresize=set_width; function set_width() { var sw_min=999999; var sh_min=999999; if (document.documentElement && document.documentElement.clientWidth) { sw_min=document.documentElement.clientWidth; sh_min=document.documentElement.clientHeight; } if (typeof(self.innerWidth)!="undefined" && self.innerWidth) { if (self.innerWidth<sw_min) sw_min=self.innerWidth; if (self.innerHeight<sh_min) sh_min=self.innerHeight; } if (document.body.clientWidth) { if (document.body.clientWidth<sw_min) sw_min=document.body.clientWidth; if (document.body.clientHeight<sh_min) sh_min=document.body.clientHeight; } if (sw_min==999999 || sh_min==999999) { sw_min=800; sh_min=600; } swide=sw_min; shigh=sh_min; } function createDiv(height, width) { var div=document.createElement("div"); div.style.position="absolute"; div.style.height=height; div.style.width=width; div.style.overflow="hidden"; return (div); } // ]]> </script>

Jangan lupa letakkan gadgetnya di posisi paling bawah sendiri  atau paling atas, selanjutnya save dan lihat hasilnya.....Selamat Mencoba

Share