Monday, June 3, 2013

Membuat Efek Balon Keren Pada Cursor Di Blog

Alhamdulillah sob saya masih diberi kesempatan untuk membagikan sesuatu kepada sobat semua. Sebenarnya saya sedang menjalani Ujian Kenaikan Kelas yaitu untuk saya menuju kelas 9 SMP. Tapi saya juga ingin membagikan sesuatu ke sobat makannya saya membagikan Membuat Efek Balon Keren Pada Cursor Di Blog sekarang. Artikel Membuat Efek Balon Keren Pada Cursor Di Blog menjadi pembuka artikel saya hari ini dan semoga artikel Membuat Efek Balon Keren Pada Cursor Di Blog dapat terindeks oleh mesin pencari Google , Amiin

Sebelumnya saya juga pernah membagikan kepada sobat informasi dan tutorial , yaitu informasi mengenai Wow Ternyata Google Sudah Peringkat 2 Alexa dan tutorial tentang Membuat Recent Comment Keren Dengan Pemberitahuan sobat bisa coba artikel-artikel disamping , siapa tahu dapat bermanfaat bagi sobat semua.

Efek Balon Keren Pada Cursor Di Blog juga bisa untuk memperindah tampilan blog sobat. Mengapa ??? karena efek ini memberikan keindahan berupa balon-balon yang berterbangan. Beginilah contoh gambar Efek Balon Keren Pada Cursor Di Blog :

Efek Balon Keren Pada Cursor Di Blog

Sobat sudah meliah gambar di atas kan ?? coba lihat bagian kanan gambar tersebut , bagian kanan diatas merupakan contoh Efek Balon Keren Pada Cursor Di Blog , dan tidak ada salahnya sobat mencobanya , karena saya pn pernah mencoba cara Membuat Efek Balon Keren Pada Cursor Di Blog ini.

Bila sobat ingin menerapkan tutorial diatas maka sobat harus lakukan langkah-langkah berikut :

1. Login ke Blogger Sobat
2. Klik Tata Letak > Tambahkan Gadget
3. Pastekan kode dibawah ini pada kolom yang disediakan di Tambahkan Gadget
<script type="text/javascript"> var colours=new Array("#EC0000", "#EC0000", "#EC0000", "#EC0000", "#EC0000"); // warna untuk border-top, border-right, border-bottom, border-left dan background gelembung var bubbles=100; // jumlah maksmal gelembung var x=ox=400; var y=oy=300; var swide=800; var shigh=600; var sleft=sdown=0; var bubb=new Array(); var bubbx=new Array(); var bubby=new Array(); var bubbs=new Array(); window.onload=function() { if (document.getElementById) { var rats, div; for (var i=0; i<bubbles; i++) { rats=createDiv("3px", "3px"); rats.style.visibility="hidden"; 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)"; document.body.appendChild(rats); bubb[i]=rats.style; } set_scroll(); set_width(); bubble(); }} function bubble() { var c; if (x!=ox || y!=oy){ ox=x; oy=y; for (c=0; c<bubbles; c++) if (!bubby[c]) { bubb[c].left=(bubbx[c]=x)+"px"; bubb[c].top=(bubby[c]=y)+"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; bubbx[i]+=(i%5-2)/5; if (bubby[i]>sdown && bubbx[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"; bubb[i].left=bubbx[i]+"px"; } else { bubb[i].visibility="hidden"; bubby[i]=0; return; } } } document.onmousemove=mouse; function mouse(e) { set_scroll(); y=(e)?e.pageY:event.y+sleft; x=(e)?e.pageX:event.x+sdown; } window.onresize=set_width; function set_width() { if (document.documentElement && document.documentElement.clientWidth) { swide=document.documentElement.clientWidth; shigh=document.documentElement.clientHeight; } else if (typeof(self.innerHeight)=="number") { swide=self.innerWidth; shigh=self.innerHeight; } else if (document.body.clientWidth) { swide=document.body.clientWidth; shigh=document.body.clientHeight; } else { swide=800; shigh=600; } } window.onscroll=set_scroll; function set_scroll() { if (typeof(self.pageYOffset)=="number") { sdown=self.pageYOffset; sleft=self.pageXOffset; } else if (document.body.scrollTop || document.body.scrollLeft) { sdown=document.body.scrollTop; sleft=document.body.scrollLeft; } else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) { sleft=document.documentElement.scrollLeft; sdown=document.documentElement.scrollTop; } else { sdown=0; sleft=0; } } 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>
KETERANGAN : kode yang berwarna merah sobat sesuaikan dengan warna yang sobat mau.

4. Simpan Gadget
5. Lihat hasilnya di blog sobat

Mudah kan sob menerakan cara diatas ???
Demikianlah postingan saya kali ini yaitu tentang Membuat Efek Balon Keren Pada Cursor Di Blog Semoga bisa berguna dan bermanfaat bagi kita semua , Amiin . Dan seperti biasanya sob , bila ada tutur kata atau pengucapan saya yang kurang baik , saya mohon maaf sebesar-besarnya , Wassalam

No comments:

Post a Comment