Cara membuat Buku Tamu melayang Disamping

kali ini kita senatiasa belajar Untuk menampilkan buku tamu yang melayang di samping
pertama anda harus sudah punya / terdaftar di soutbox anda bila belum punya klik disini
OK Untuk Cara membuatnya sebagai berikut :
Pake CTRL+C Untuk MengCopy
<style type="text/css">
#gb{
position:fixed;
top:100px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i953.photobucket.com/albums/ae20/hendrytha/chating.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:2px;
}
</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">

LETAKKAN KODE WIDGET SHOUTBOX ANDA DI SINI


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

yang warna hijau kode icon buku tamu anda
letakan kode  soutmix atau kode chat box anda pada tulisan berwarna merah
setelah itu tinggal anda simpan
selesai
selamat mencoba
senantiasa belajar

Labels: