Membuat Cbox menarik

Sang Admin mendapatkan kode ini saat blogwalking, ternyata bagus juga, makanya saya akan berbagi info dengan anda, check it out!!

1. Login ke blogger
2. Klik Rancangan-->klik Elemen Laman-->klik Tambah Gadget-->klik HTML/Javascipt
3. Copy kode di bawah ini ke HTML/Javascipt

   <style type="text/css">
   #gb{
   position:fixed;
   top:20px;
   z-index:+1000;
   }* html #gb{position:relative;}
   .gbtab{
   height:150px;
   width:50px;
   float:left;
   background:url('http://i1042.photobucket.com/albums/b429/Farix_2010/Chatting.png') no-repeat;
   }
   .gbcontent {
   float:left;
   border:1px solid #BB0000;
   -moz-border-radius-bottomleft:10px;
   -webkit-border-radius-bottomleft:10px;
   -o-border-radius-bottomleft:10px;
   -khtml-border-radius-bottomleft:10px;
   -moz-border-radius-topright: 10px;
   -moz-border-radius-topleft: 10px;
   background: #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3oeAQFMDZH4LIZeD8U3f7e1VV2bmptgxXIG2mss9SCoGTAjBJafBHO4Ye4szZiuhoc24xNX04wihoGopkFRGfBUHDHlAyvH4tWIpLnANOklDDiiasnX-S0a03MdmXfPIauDCfjeeRrFam/s1600/api.gif) no-repeat bottom;
   padding:10px;
   }
   </style>
   <script type="text/javascript">
   function showHideGB(){
   var gb = document.getElementById("gb");
   var w = gb.offsetWidth;
   gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
   gb.opened = !gb.opened;
   }function moveGB(x0, xf){
   var gb = document.getElementById("gb");
   var dx = Math.abs(x0-xf) > 25 ? 25 : 1;
   var dir = xf>x0 ? 1 : -1;
   var x = x0 + dx * dir;
   gb.style.right = x.toString() + "px";
   if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 5);}
   }</script>
   <div id="gb">
   <div class="gbtab" onmouseover="showHideGB()"> </div>
   <div class="gbcontent">
   <center>
   
   Kode Cbox kamu
   
   <br />
   <div style="text-align:center">
   <a onclick="showHideGB()" class="tips-fade" title="klik untuk tutup chattingbox">
   <center><hr /><img src="http://i1042.photobucket.com/albums/b429/Farix_2010/CloseComment-1.png" /><hr />
   <div style="text-align:right"> <font size="2"><a href="http://besttaufiqblog.blogspot.com/2011/04/cara-membuat-buku-tamu-keren.html"target=_blank"><div style="color: #ffffff;">
   <span style="font-size: xx-small;">:: Get This Widget! ::</span></div></a></font></div>
   </center>
   </a>
   </div>
   </center></div>
   <script type="text/javascript">
   var gb = document.getElementById("gb");
   gb.style.right = (50-gb.offsetWidth).toString() + "px";
   </script></div> 

4. Simpan dan lihat hasilnya, contohnya terdapat di blog ini

source: http://besttaufiqblog.blogspot.com/2011/04/cara-membuat-buku-tamu-keren.html