Cara Memasang Animasi bintang Jatuh Cursor pada Blog

Cursor yang bertabur bintang adalah salah satu cara untuk mempercantik tampilan blog. Karena saat cursor di geser kursor tersebut akan mengeluarkan bintang-bintang. dan bisa membuat blog anda menarik dilihat.

Caranya ikuti langkah-langkah dibawah ini :

• Login ke blogger dengan ID Anda

• Pada halaman Dashboard klik link Nama Blog Anda

• Klik menu Layout >> Add a Gadget, pilih type gadget HTML/Javascript

• Copy script di bawah ini dan paste pada kotak Content, tidak perlu diberi Title  
• <script type='text/javascript'>
  // <![CDATA[
  var colour="#52D8ED";
  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>

• Untuk menyesuaikan dengan tampilan blog Anda, silahkan ganti kede warna (tulisan berwarna merah) dengan warna yang anda inginkan, gunakan HEX Color Generator Tool yang terdapat pada side bar blog ini untuk mengetahui kode warna.

• Jangan lupa untuk menekan tombol Save untuk menyimpan gadget

• Periksa halaman blog Anda dan ucapkan Alhamdulillah, sekarang blog Anda sudah bertaburan bintang.

HEX Color Generator Tool
Bintang biru
<script src="http://denisahlan.netau.net/bintang.biru.js" type="text/javascript"></script>

Bintang hijau
<script src="http://denisahlan.netau.net/bintang.hijau.js" type="text/javascript"></script>

Bintang merah
 <script src="http://denisahlan.netau.net/bintang.hijau.js" type="text/javascript"></script>

Bintang putih
<script src="http://denisahlan.netau.net/bintang.putih.js" type="text/javascript"></script>

Bintang ungu
<script src="http://denisahlan.netau.net/bintang.ungu.js" type="text/javascript"></script>  

6.Setelah kode di copy jangan lupa di simpan dan lihat hasilnya