Sebenarnya menu guestbook ini merupakan penyempurnaan dari menu guestbook sebelumnya Widget Buku Tamu Slide Effect With jQuery Saya ubah lagi biar lebih Familiar dikalangan blogger.hehee,..
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf4WIx7JGAAenLR_GJt44UqJvNqx8wX8RMlAnEGj1P9kA2Pih8C5PN3GrDlkIRuHLftCAqy8A2AHwBppm4GXBYFUckay2FHbUVoROCBckCLhuWJvpkTvLGR53JZyKxTy5mpXyqXllCLRE/s1600/Guestbook.png)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf4WIx7JGAAenLR_GJt44UqJvNqx8wX8RMlAnEGj1P9kA2Pih8C5PN3GrDlkIRuHLftCAqy8A2AHwBppm4GXBYFUckay2FHbUVoROCBckCLhuWJvpkTvLGR53JZyKxTy5mpXyqXllCLRE/s1600/Guestbook.png)
Baiklah jika sobat ingin memasangnya silahkan ikuti langkah-langkah berikut :
1. Login Ke Akun Blog Sobat
2. Pilih Rancangan/Tata Letak3. Tambah Gadget/Add Gadget Pilih HTML JAVA SCRIPT
4. Masukan Script Berikut Di dalamnya.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".gbbtn").click(function(){
$("#gbcontent").slideToggle("slow");
$(this).toggleClass("active"); return false;
});
});
</script>
<style>
/* ---------------
Fixed Guestbook Slide effect with jQuery II
by : Muchtar
Url : http://.blogspot.com
---------------------------------- */
.gb {
position:fixed;
top:0px;right:450px;
z-index:+1000;
}
#gbcontent {
height:auto;width:auto;display:none;padding:10px;
Background:transparent;
border-bottom:10px solid transparent;border-left:5px dotted #ccc;border-top:10px solid transparent;border-right:5px dotted #ccc;
}
.gbbtn {
position:fixed;_position:relative;top:50px;right:0px;
clip:inherit;_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight)
}
.active {
background-position:right 12px;
}
</style>
<div class="gb">
<div id="gbcontent">
<--- KODE GUESTBOOK ANDA --->
</div>
<div id="gbbtn"><a href="#" class="gbbtn" title="Buku Tamu"><img alt="Buku Tamu" heigth="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqm1VQC7ySj9Ij6vusEBxgbCATK12N9bkrhvo8-7GUQ6k2kchalRApUToV48AZLtvJir_7Lkw4V0EB-UVbMUqhyphenhyphenhEU2w0gP-LwVwim4CZ1QgkYs4JSD0McFCbNUzsBZYsjQuMOGGfvZwQ/s1600/Guestbook.png" border="0" /></a></div></div>
5.Save.
Catatan :
- Sedangkan yang berwarna merah ganti dengan kode Cbox.
NB : Jika sobat belum memiliki Buku tamu untuk chatting bisa lihat tutorial membuatnya disini..
Semoga tutorial ini berguna bagi anda. TRIMS ^^
Posting Komentar