membuat buku tamu autohide di blog

hai sebelumnya saya sudah share tentang bagaimana caranya membuat buku tamu pada blog anda 
kali ini saya akan memberitahu kepada anda bagaimana cara membuat buku tamu pada blog anda yang sebelumnya seperti gadged biasa,kali ini tampilan buku tamu anda akan melayang mengikuti scrol dan akan autohide jadi tidak akan membuat tampilan blog anda menjadi penuh nah langsung aja yah,

1.anda login ke blogger inget jangan login ke facebook

2.masuk ke rancangan 

3.add gadget

4.kemudian copy dan paste kode sibawah 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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBFxgnnJhj3sWTBdzQ7cCki9PI3dKWOFEUkQi19eZBsgVLN20LBCBfZX9XoMeCn9xMBTTSuaSOLVBTBvpu6xE8uHT05qQNZtzDg5CebGSlc9joywS9FpSqMshBfzMEVSXxGosFkmFVqpGw/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #0F0;
background: #09C;
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">


isi dengan kode buku tamu kamu


ingin buku tamu seperti ini kunjungi:
<a href="http://kstt-blog.blogspot.com/">DI SINI

</div>

</div>

</div>

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

Read more:KSTT BLOG

5.yang tulisannya warna merah ganti dengan kode buku tamu kamu ya
6.simpan dan lihat hasilnya

sekian

Posted in: BLOGGER