Shout box melayang di sisi kanan [Edisi3]

         Sama seperti yang sebelumnya juga ini adalah widget Shout box yang melayang di sisi bog anda. yang membedakan hanyalah tempat letaknya, jika yang sebelumnya di sisi kiri kali ini di sisi kanan. dan ini adalah buatan sendiri dari Sobat Fauza. Oke Langsung saja saya berikan Code HTML/JavaScript-nya.

<!-- right hidden chatbox by http://www.sobatfauza.co.vu/ START -->
<style>
#hcr {
position:fixed;top:100px;
z-index:+1000;
}
* html #hcr {position:relative;}
.hcrtab {height:120px;width:30px;
float:left;
cursor:pointer;
background:url('http://file-fauza.googlecode.com/files/Shout%20Box%20melayang%20di%20sisi%20kanan.png') no-repeat;
}
.hcrcontent {
float:left;
border:2px solid #790909;
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">

Silakan Pasang Kode Buku Tamu sobat yang sudah di copy tadi Di Sini

<br />
<div class="hc-credit">
<span style="float:left">
<!-- THIS CREDIT MUST STAY INTACT FOR LEGAL USE -->
<span >
<span > Get this</span>
<a href=http://www.sobatfauza.co.vu/2013/03/shout-box-melayang-di-sisi-kanan-edisi3.html" target="_blank">
<span class="Apple-style-span" > Desaign1</span>
</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://www.sobatfauza.co.vu/ END -->

 Note : ganti tulisan warna Hijau di atas dengan html/javascript Cbox/buku tamu yang tadi....

Mudahkan Sobat...!!!
Semoga dapat bermanfaat....^^