Cara Membuat Buku Tamu Show Hide

   Cara Membuat Buku Tamu Floating Show Hide, setelah saya mengganti Tampilan Blog saya, saya juga mengganti Tampilan Buku Tamu saya. Buku Tamu saya dulu hanya saya tampilankan disamping kanan halaman Blog saya tapi kali ini saya ganti menggunakan Buku Tamu Floating Show Hide. Langsung saja Cara Membuat Buku Tamu Show Hide sebagai berikut :

1. Log in akun Blogger anda
2.Pilih Design
3.Add Gadget
4.Setelah itu anda pilih HTML/JavaScript
5.Copy kode 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://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.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">
<<<<--- MASUKKAN KODE SHOUTBOX ANDA DISINI--->>>>
<div style="text-align:right">
<a href="http://yepiaddianto.blogspot.com/2012/01/cara-membuat-buku-tamu-show-hide.html">
[Pasang Widget]
</a>|<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

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

6.Save

   Mudahkan Cara Membuat Buku Tamu Floating Show Hide ! Nah semoga artikel ini bermanfaat untuk kawan semuanya.Semoga Bermanfaat dan Selamat Bereksperimen. :)
Terimakasih anda telah membaca artikel Cara Membuat Buku Tamu Show Hide Silahkan baca artikel Yepi Share Everything Tentang | Yang lainnya. Dan saya ucapkan juga terimakasih atas kunjungan Anda serta kesediaan Anda membaca artikel ini. Kritik dan saran dapat anda sampaikan melalui kotak komentar. Semoga Bermanfaat untuk anda.
Jangan Lupa Gabung Bersama Kami Dengan Like Facebook Di Bawah Ini :

1 komentar:

Fijaya mengatakan...

makasih, berhasil! :D
kunjungi blog saya juga ya http://memilkyway.blogspot.com

Posting Komentar

Jangan lupa tinggalkan komentar anda disini dan gunakan kata-kata yang bijak dalam berkomentar. Dilarang keras memasukkan segala bentuk link dalam komentar, karena itu dianggap SPAM