Minggu, 15 Juli 2012

Cara Membuat Buku Tamu Autohide di blog

hai sebelumnya saya sudah share tentang bagaimana cara membuat buku tamu autohide di 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 ya? okok lihat dibawah :

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/AVvXsEgXo9ucHlHondBATHOr1gDNYSS02mm0QQ8hJ_dlmGeBSTDMxm7HnUKRXWF8GEBtnXUv4FvF6xHV-5iSVUWuS5waz9WYABez9I3pjxKClGnLgHMpLTNoyh4EYYi-UzclENA0-jJUvgZ3V1uN/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #0F0;
background: #09C;
padding:10px;
}
</style>


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>









isi dengan kode buku tamu kamu


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

</div>

</div>

</div>


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

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

1 komentar: