Cara Membuat Buku tamu melayang pada blog

Kali ini saya akan membahas cara membuat buku tamu melayang pada blog,
jika sobat jenih dengan tampilan chatbox sobat yang bikin sepet mata alias menuh-menuhin blog sobat xixixixii , berarti sobat nda salah mampir nih, berikut adalah tips cara membuat tampilan chatbox sobat melayang/berada di bagian pojok atas blog sobat sekalian, oke langsung saja berikut caranya:




jika sobat belum mempunyai chatbox'nya silahkan membuat terlebih dahulu di SINI, jika belum jelas cara pembuatanya bisa melihat postingan sebelumnya di SINI

Oke sobat jika sudah mempunyai chatbox langsung saja ke add gadget di blog sobat lalu paste script berikut ^_^

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ9MbTQENcsr4cL3TruE9IP_qiq4fnd7YIi0MEPdnMz5le3CQhZowChfubmBnBCyKHdF7Psw5jHnYZZ5wIMh3ml4zzL81i_YtYUbruPIBOU5zCqNptK2ZR1mr5lrrsgoazm6NmHsih044/s1600/bukutamu.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 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+")", 10);}

}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
Silahkan Paste script chatbox sobat di sini

<div style="text-align:right">
<a href="http://abelavriyanno.blogspot.com/2012/04/cara-membuat-buku-tamu-melayang-di-sisi.html">[get this widget]</a>><a href="javascript:showHideGB()">
[Tutup]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>

Keterangan : Ganti text warna biru dengan script Chatbox sobat,

Demikianlah cara membuat bukutamu tamu melayang pada blog, semoga bermanfaat ^_^