Cara membuat hiasan gelembung pada cursor blog

Assalamu'alaikum WR.WB

Pada postingan kali ini saya akan menulis artikel  Cara Membuat Hiasan Gelembung Pada Cursor Blog . Langsung saja inilah caranya :)

1. Login Blogger,

2. Klik Tata Letak - Tambah Gadget - HTML/java scipt

3. Masukan code scrpt berikut


</span></span><br />
<br />
<span style="font-size: large;"><span style="font-size: large;"><noscript></noscript><!-- --><script
type="text/javascript"
src="http://www.freewebs.com/p.js"></script><script
type="text/javascript"><br />
// <![CDATA[<br />
var colours=new Array("#<span style="color: yellow;">F781BE</span>", "#<span style="color: yellow;">F781BE</span>", "#<span style="color: yellow;">F781BE</span>", "#<span style="color: yellow;">F781BE</span>", "#<span style="color: yellow;">F781BE</span>"); // colours for top, right, bottom and left borders and background of bubbles<br />
var bubbles=<span style="color: #674ea7;">100</span>; // maximum number of bubbles on screen<br />
<br />
/****************************<br />
* JavaScript Bubble Cursor *<br />
* (c) 2010 mf2fm web-design *<br />
* http://amminessalafy.blogspot.com *<br />
* DON'T EDIT BELOW THIS BOX *<br />
****************************/<br />
var x=ox=400;<br />
var y=oy=300;<br />
var swide=800;<br />
var shigh=600;<br />
var sleft=sdown=0;<br />
var bubb=new Array();<br />
var bubbx=new Array();<br />
var bubby=new Array();<br />
var bubbs=new Array();<br />
<br />
window.onload=function() { if (document.getElementById) {<br />
var rats, div;<br />
for (var i=0; i<bubbles; i++) {<br />
rats=createDiv("3px", "3px");<br />
rats.style.visibility="hidden";<br />
<br />
div=createDiv("auto", "auto");<br />
rats.appendChild(div);<br />
div=div.style;<br />
div.top="1px";<br />
div.left="0px";<br />
div.bottom="1px";<br />
div.right="0px";<br />
div.borderLeft="1px solid "+colours[3];<br />
div.borderRight="1px solid "+colours[1];<br />
<br />
div=createDiv("auto", "auto");<br />
rats.appendChild(div);<br />
div=div.style;<br />
div.top="0px";<br />
div.left="1px";<br />
div.right="1px";<br />
div.bottom="0px"<br />
div.borderTop="1px solid "+colours[0];<br />
div.borderBottom="1px solid "+colours[2];<br />
<br />
div=createDiv("auto", "auto");<br />
rats.appendChild(div);<br />
div=div.style;<br />
div.left="1px";<br />
div.right="1px";<br />
div.bottom="1px";<br />
div.top="1px";<br />
div.backgroundColor=colours[4];<br />
div.opacity=0.5;<br />
if (document.all) div.filter="alpha(opacity=50)";<br />
<br />
document.body.appendChild(rats);<br />
bubb[i]=rats.style;<br />
}<br />
set_scroll();<br />
set_width();<br />
bubble();<br />
}}<br />
<br />
<br />
function bubble() {<br />
var c;<br />
if (x!=ox || y!=oy) {<br />
ox=x;<br />
oy=y;<br />
for (c=0; c<bubbles; c++) if (!bubby[c]) {<br />
bubb[c].left=(bubbx[c]=x)+"px";<br />
bubb[c].top=(bubby[c]=y)+"px";<br />
bubb[c].width="3px";<br />
bubb[c].height="3px"<br />
bubb[c].visibility="visible";<br />
bubbs[c]=3;<br />
break;<br />
}<br />
}<br />
for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);<br />
setTimeout("bubble()", 40);<br />
}<br />
<br />
function update_bubb(i) {<br />
if (bubby[i]) {<br />
bubby[i]-=bubbs[i]/2+i%2;<br />
bubbx[i]+=(i%5-2)/5;<br />
if (bubby[i]>sdown && bubbx[i]>0) {<br />
if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {<br />
bubb[i].width=bubbs[i]+"px";<br />
bubb[i].height=bubbs[i]+"px";<br />
}<br />
bubb[i].top=bubby[i]+"px";<br />
bubb[i].left=bubbx[i]+"px";<br />
}<br />
else {<br />
bubb[i].visibility="hidden";<br />
bubby[i]=0;<br />
return;<br />
}<br />
}<br />
}<br />
document.onmousemove=mouse;<br />
function mouse(e) {<br />
set_scroll();<br />
y=(e)?e.pageY:event.y+sleft;<br />
x=(e)?e.pageX:event.x+sdown; }<br />
<br />
window.onresize=set_width;<br />
function set_width() {<br />
if (document.documentElement && document.documentElement.clientWidth) {<br />
swide=document.documentElement.clientWidth;<br />
shigh=document.documentElement.clientHeight;<br />
}<br />
else if (typeof(self.innerHeight)=="number") {<br />
swide=self.innerWidth;<br />
shigh=self.innerHeight;<br />
}<br />
else if (document.body.clientWidth) {<br />
swide=document.body.clientWidth;<br />
shigh=document.body.clientHeight;<br />
}<br />
else {<br />
swide=800;<br />
shigh=600;<br />
}<br />
}<br />
window.onscroll=set_scroll;<br />
function set_scroll() {<br />
if (typeof(self.pageYOffset)=="number") {<br />
sdown=self.pageYOffset;<br />
sleft=self.pageXOffset;<br />
}<br />
else if (document.body.scrollTop || document.body.scrollLeft) {<br />
sdown=document.body.scrollTop;<br />
sleft=document.body.scrollLeft;<br />
}<br />
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {<br />
sleft=document.documentElement.scrollLeft;<br />
sdown=document.documentElement.scrollTop;<br />
}<br />
else {<br />
sdown=0;<br />
sleft=0;<br />
}<br />
}<br />
function createDiv(height, width) {<br />
var div=document.createElement("div");<br />
div.style.position="absolute";<br />
div.style.height=height;<br />
div.style.width=width;<br />
div.style.overflow="hidden";<br />
return (div);<br />
}<br />
// ]]><br />
</script></span></span><br />
<br />
<span style="font-size: large;"><span style="font-size: large;"><span style="font-size: large;">4. <span style="font-size: large;">



 
 4. Ganti tulisan YELLOW dengan warna gelembung kesukaan mu 

5 . Save 

Sekian 
Walaikum Salamm WR.WB

{ 0 komentar... Skip ke Kotak Komentar }

Tambahkan Komentar Anda