Cara buat kursor buih

Kursor ini seakan akan sama dengan kursor bintang berjatuhan sebelum ini,tetapi kali ini adalah dalam bentuk gelembung buih yang akan naik keatas bila kursor digerakkan.
bubble cursor

Cara memasangnya:
1.Log in keblogger terlebih dahulu
2.Pilih Layout...Add a Gadget



3.HTML/Javascript  
4.Masukkan kod dibawah ini :
<script type="text/javascript" src="https://sites.google.com/site/teknikbuatblog/tbb/kursorbuih.js"></script><script type="text/javascript">

// <![CDATA[

var colours=new Array("#695DA2", "#695DA2", "#695DA2", "#695DA2", "#695DA2"); // colours for top, right, bottom and left borders and background of bubbles

var bubbles=100; // maximum number of bubbles on screen



/****************************

* JavaScript Bubble Cursor *

*(c) 2009 mf2fm web-design *

****************************/

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>
# warna buih boleh ditukarkan pada teks berwarna oren dan kod nya boleh didapati disini

5.Kemudian klik pada save

update 8/5/2013

Catat Ulasan

Letakkan komen anda disini.Segala komen adalah dihargai.Sila buat backup bila membuat perubahan pada template.Terima Kasih.

16 Comments:

Melati Qistyna's Mummy berkata...
terima kasih atas kunjungan

Byk benda boleh dibuat kalau rajin....heheheh


Selamat tahun baru buat tuan sekeluarga... :D

Abed Saragih berkata...
terima kasih atas kunjungan

Mas,,saya mau tanya nih..

gmna membuat postingan di halaman 2 sama persis dengan tampilan di halaman sebelumnya (hal 1)

soalnya pada hal 2 bentuk postingannya cuma judul aja?Tlong bantuannya :)

Andi berkata...
terima kasih atas kunjungan

wuih, kebetulan lagi nyari nih :D
mampir ya http://sekedar-tutorial.blogspot.com/2012/01/karapan-sapi-tradisi-madura-asli.html

sampeweweh berkata...
terima kasih atas kunjungan

wah kerentutorialnya izinsave dulu hehe

gadis mystery berkata...
terima kasih atas kunjungan

terima kasih tuan...

danial berkata...
terima kasih atas kunjungan

thanks banyak2 sbb ajar buat semua tu...thanks

Rudy Hartono berkata...
terima kasih atas kunjungan

thanks atas informasinya yang bermanfaat

BLACK HAWK berkata...
terima kasih atas kunjungan

Terima Kasih Telah Berkunjung!!!!!!!!!!!!!!

grosir busana muslim berkata...
terima kasih atas kunjungan

artikel tulisan yang baik,,nice post slam kenal

aida berkata...
terima kasih atas kunjungan

makasih tuk tutorialnya. tau cara pasang efek salju yang berjatuhan pada halaman blog. tolong dijawab. makasih.

keroppi_ijo berkata...
terima kasih atas kunjungan

baehasiiil..hehe..
thx :)
selain buih donk :D

keroppi_ijo berkata...
terima kasih atas kunjungan

THX :)
aku bisa akhirnya..

Shuhaida Subri berkata...
terima kasih atas kunjungan

best la blog ni.

arie5758 berkata...
terima kasih atas kunjungan

Wah yang saya cari ternyata ketemu disini, terima kasih ya sob sharing ilmunya. Sementara saya ijin menyimpan di notepad, karena belakangan template saya sering error jika ditambah script baru :)

aneh... berkata...
terima kasih atas kunjungan

tq very much

Chiiicah berkata...
terima kasih atas kunjungan

Bosan bintang jatuh, coba yg buih ahh....

Related Posts Plugin for WordPress, Blogger...