Trik Cara Membuat Buku Tamu Show Hide

Trik Cara Membuat Buku Tamu Show Hide | Pada kesempatan ini saya akan share trik cara membuat buku tamu show hide. Untuk lebih jelasnya lihat buku tamu atau guest book yang ada disebelah kanan atas tu sob.. Gimana.. sobat tertarik untuk menambahkan di blog sobat..?! Buku tamu ini saya dapat dari blog sahabat juga tapi lupa alamatnya dimana tuh. Yang jelas ni bukan bikinan saya sob, saya ga ngerti buat kode-kode script gituan.. hehe.. Oy sob sebenarnya saya dah lama pengen share buku tamu ini, tapi ternyata memasukkan kode script di postingan berbeda ma nulis kata-kata biasa,, wah saya bener-bener baru tau.. katro pe diulang-ulang berapa kali gagal terus. Tapi sekarang dah lumayan bisa sob..he.. OK langsung az...jika sobat tertarik silahkan copy kodenya dibawah ini..

<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('http://i365.photobucket.com/albums/oo98/gondrezt/Green%20Blog/tabs2.gif') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #00960e;
background:#015108;
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">
<div align="center">KODE CBOX

</div></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

Atur posisi dengan merubah angka 50 diatas, ganti tulisan KODE CBOX dengan kode cbox sobat. Cara memasangnya yaitu seperti biasa: Login > Rancangan > Tambah Gadget > HTML/Javascript > paste kodenya lalu save. Jreng... sekarang sobat sudah mempunya buku tamu show hide yang menarik.. :D

Selamat mencoba semoga berhasil...

Share this post!