how to build float cbox

untuk beberapa blogger, mungkin sudah tidak asing dengan cbox atau shoutmix. cbox atau shoutmix merupakan fasilitas pihak ketiga yang menyediakan widget untuk meninggalkan jejak para pengunjung blog.
karena kejenuhan para blogger dan juga pengunjung, maka beberapa orang berkreasi dengan cbox ini.
mereka menggunakan java script untuk membuat cbox sebagai buku tamu atau guest book dan dipasang dengan cara 'floating' atau mengambang di sebelah kiri blog. kita sebagai pengunjung harus klik dahulu buku tamu, lalu mulai meninggalkan jejak dengan meninggalkan komentar atau sekedar meninggalkan back link.
cara untuk membuatnya adalah
1. daftar di cbox
2. copy kode html/java script dari cbox
3. buat widget html/java script di blogger
4. isi widget html/java script dengan kode dibawah ini


<!-- right hidden chatbox by http://gadogadorahma.blogspot.com START -->
<style>
#hcr {
position:fixed;
top:150px;
z-index:+1000;
}
* html #hcr {position:relative;}
.hcrtab {
height:150px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFT4tpIrK-93K377ffFZt1qamJnPKPI5vtMK7GaiDFpe-c2NXWlxIdZjlY1mvQ8aNkxxIboEsDh5LYDhfK-XykihMumd5WNEa3y1k7zemDyIauGHp0rMp5VZvuzVxzZg1FmxDpau5WiE4/s400/cbblue-2-LEFT.png') no-repeat;
}
.hcrcontent {
float:right;
border:2px solid #A9D0F5;
background:#f3f6f7;
padding:10px;
}
.hc-credit {font-size:9px}
.hc-credit a {text-decoration:none}
</style>
<script type="text/javascript">
function showHidehcr(){
var hcr = document.getElementById("hcr");
var w = hcr.offsetWidth;
hcr.opened ? movehcr(0, 30-w) : movehcr(20-w, 0);
hcr.opened = !hcr.opened;
}
function movehcr(x0, xf){
var hcr = document.getElementById("hcr");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
hcr.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("movehcr("+x+", "+xf+")", 10);}
}
</script>
<div id="hcr">
<div class="hcrtab" onclick="showHidehcr()"> </div>
<div class="hcrcontent">
<center><blink><span style="font-weight:bold;">Tinggalkan Pesan Anda</span></blink></center><br />
< MASUKKAN CODE SCRIPT CBOX ANDA -->

<br />
<div class="hc-credit">
<span style="float:left">
<!-- THIS CREDIT MUST STAY INTACT FOR LEGAL USE -->
<a href="http://gadogadorahma.blogspot.com/2010/01/hidden-chatbox.html" target="_blank">
Get this widget!
</a>
</span>
<span style="float:right">
<a href="javascript:showHidehcr()">
[close]
</a>
</span>
</div>
</div>
</div>
<script type="text/javascript">
var hcr = document.getElementById("hcr");
hcr.style.right = (30-hcr.offsetWidth).toString() + "px";
</script>
<!-- right hidden chatbox by http://gadogadorahma.blogspot.com END -->