Home » » Tutorial membuat Shoutbox sembunyi di samping Blog

Tutorial membuat Shoutbox sembunyi di samping Blog

Jika pada postingan sebelumnya ana udah menshare Tutorial membuat FP sembunyi di samping Blog, maka pada postingan kali ini ana mau menshare Tutorial membuat Shoutbox sembunyi di samping Blog. No koment, go to the Point...........

1> Masuk ke akun blog anda
2> Pilih Design/Rancangan
3> Pilih Add Gadget
4> Pilih HTML/Javascript
5> Masukkan kode dibawah

<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://2.bp.blogspot.com/-hp5hb7Z7Gvk/TmzEhhJZRmI/AAAAAAAAGgo/vmECDANflYw/s320/shoutbox.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #666666;
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">


Kode Shoutbox anda disini

<div style="text-align:right"><a href="http://ketikwww.blogspot.com/2012/01/tutorial-membuat-shoutbox-sembunyi-di.html" target="_blank"><small>tutorial here</small></a>
<a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>
6>Save dan jadi dech....
Nb: Silahkan ganti tulisan berwarna hijau dengan kode Shoutbox anda!!!
Jika anda belum mempunyai shoutbox, silahkan lihat caranya disini!

Semoga postingan Tutorial membuat Shoutbox sembunyi di samping Blog dapat bermanfaat!!!

FEATURED and RECOMENDED POSTS
1. Iconia PC tablet dengan Windows 8 pilihan terbaik
2. Iman anda menipis? Jangan dibiarkan begitu sajat... Isi ulang iman anda disini
Pasang Link Blog/Iklan anda disini. Hanya 20 ribu tampil disetiap postingan. minat? klik disini
Comments
4 Comments