Memberi Efek Salju pada Cursor Blog

بِسْمِ اللّهِ الرَّحْمَنِ الرَّحِيْمِ

Siang Member P.I.C, kali ini saya akan memberi Tutorial Seputar Blogging setelah dari tadi Menulis tentang Hacking.
Tutrial kali ini adalah Memberi Efek Salju pada Cursor Blog.


Wah gimana caranya...??

Langsung aja, ikuti Tutorial Di Bawah ini :
1. Login blog
2. Tata Letak --> Tambah Widget --> HTML/JavaScript
3. Masukkan Code Berikut :

<a href="http://24work.blogspot.com" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript"> // <![CDATA[ var colour="Black"; var sparkles=100; var x=ox=400; var y=oy=300; var swide=800; var shigh=600; var sleft=sdown=0; var tiny=new Array(); var star=new Array(); var starv=new Array(); var starx=new Array(); var stary=new Array(); var tinyx=new Array(); var tinyy=new Array(); var tinyv=new Array(); window.onload=function() { if (document.getElementById) { var i, rats, rlef, rdow; for (var i=0; i<sparkles; i++) { var rats=createDiv(3, 3); rats.style.visibility="hidden"; document.body.appendChild(tiny[i]=rats); starv[i]=0; tinyv[i]=0; var rats=createDiv(5, 5); rats.style.backgroundColor="transparent"; rats.style.visibility="hidden"; var rlef=createDiv(1, 5); var rdow=createDiv(5, 1); rats.appendChild(rlef); rats.appendChild(rdow); rlef.style.top="3px"; rlef.style.left="0px"; rdow.style.top="0px"; rdow.style.left="3px"; document.body.appendChild(star[i]=rats); } set_width(); sparkle(); }} function sparkle() { var c; if (x!=ox || y!=oy) { ox=x; oy=y; for (c=0; c<sparkles; c++) if (!starv[c]) { star[c].style.left=(starx[c]=x)+"px"; star[c].style.top=(stary[c]=y)+"px"; star[c].style.clip="rect(0px, 5px, 5px, 0px)"; star[c].style.visibility="visible"; starv[c]=50; break; } } for (c=0; c<sparkles; c++) { if (starv[c]) update_star(c); if (tinyv[c]) update_tiny(c); } setTimeout("sparkle()", 40); } function update_star(i) { if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)"; if (starv[i]) { stary[i]+=1+Math.random()*3; if (stary[i]<shigh+sdown) { star[i].style.top=stary[i]+"px"; starx[i]+=(i%5-2)/5; star[i].style.left=starx[i]+"px"; } else { star[i].style.visibility="hidden"; starv[i]=0; return; } } else { tinyv[i]=50; tiny[i].style.top=(tinyy[i]=stary[i])+"px"; tiny[i].style.left=(tinyx[i]=starx[i])+"px"; tiny[i].style.width="2px"; tiny[i].style.height="2px"; star[i].style.visibility="hidden"; tiny[i].style.visibility="visible" } } function update_tiny(i) { if (--tinyv[i]==25) { tiny[i].style.width="1px"; tiny[i].style.height="1px"; } if (tinyv[i]) { tinyy[i]+=1+Math.random()*3; if (tinyy[i]<shigh+sdown) { tiny[i].style.top=tinyy[i]+"px"; tinyx[i]+=(i%5-2)/5; tiny[i].style.left=tinyx[i]+"px"; } else { tiny[i].style.visibility="hidden"; tinyv[i]=0; return; } } else tiny[i].style.visibility="hidden"; } document.onmousemove=mouse; function mouse(e) { set_scroll(); y=(e)?e.pageY:event.y+sdown; x=(e)?e.pageX:event.x+sleft; } 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; } } window.onresize=set_width; function set_width() { if (typeof(self.innerWidth)=="number") { swide=self.innerWidth; shigh=self.innerHeight; } else if (document.documentElement && document.documentElement.clientWidth) { swide=document.documentElement.clientWidth; shigh=document.documentElement.clientHeight; } else if (document.body.clientWidth) { swide=document.body.clientWidth; shigh=document.body.clientHeight; } } function createDiv(height, width) { var div=document.createElement("div"); div.style.position="absolute"; div.style.height=height+"px"; div.style.width=width+"px"; div.style.overflow="hidden"; div.style.backgroundColor=colour; return (div); } // ]]> </script>

4. Klik Save dan Lihat Hasilnya.

Untuk var colour="Black" Member P.I.C bisa ganti dengan warna yang Member P.I.C inginkan ^_^

Pastikan Sumbernya Jika Ingin Menyebarkan Tips Ini...!!

Read More

Widget Ganti Font Blog

Setelah share tentang Maintenance Blog, kali ini penulis coba share tentang Cara Merubah Font Blog dengan Widget.

Sama halnya dengan Widget Ganti Background, Wdiget ini memudahkan Member P.I.C atau visitor Blog Member P.I.C agar lebih mudah membaca postingan yang tidak jelas.

Begini caranya :

• Login ke Blog Member P.I.C.
• Klik Rancangan.
• Pilih Edit HTML.
• Klik Tambah Widget.
• Cari yang HTML/JavaScript.
• Masukkan Kode Berikut
<center><div class='widget-content'><br><center><script><br>function go1(){<br>if (document.selecter2.select2.options<br>[document.selecter2.select2.selectedIndex].value != "none") {<br>document.getElementById('main').style.fontSize<br>=document.selecter2.select2.options<br>[document.selecter2.select2.selectedIndex].value<br>}<br>}<br><br>function go2(){<br>if (document.selecter2.select3.options<br>[document.selecter2.select3.selectedIndex].value != "none") {<br>document.getElementById('main').style.fontFamily<br>=document.selecter2.select3.options<br>[document.selecter2.select3.selectedIndex].value<br>}<br>}<br></script><br><form id="forma" name="selecter2" method="POST"><br><br><select onchange="go2()" style="font-family:verdana;font-size:8pt" name="select3" size="1"><br><option value="Times New Roman" />Times New Roman<br><option value="Arial" />Arial<br><option selected value="Book Antiqua" />Book Antiqua<br><option value="Bookman Old Style" />Bookman Old Style<br><option value="Century Gothic" />Century Gothic<br><option value="Comic Sans Ms" />Comic Sans Ms<br><option value="Tahoma" />Tahoma<br><br><option selected value="Trebuchet Ms"//>Trebuchet Ms<br><option value="Verdana" />Verdana<br></select><br><select onchange="go1()" style="font-family:verdana;font-size:8pt" name="select2" size="1"><br><option value="8px" />8<br><option value="9px" />9<br><option value="10px" />10<br><option value="11px" />11<br><option selected value="12px" />12<br><option value="14px" />14<br><option value="16px" />16<br><option value="18px" />18<br></select></form><center></center></center><br></div><br><br><a href="http://rizkyariff.blogspot.com/2011/12/cara-membuat-widget-ganti-font-di-blog.html" target="_blank"><blink>Get This Widget</blink></a></center>;

• Klik Save dan Lihat Hasilnya. ^_^

Semoga Bermanfaat, kalo Pengin share ilmunya boleh, tapi JANGAN LUPA CANTUMKAN SUMBERNYA.

Read More