Sorok Shoutbox

Assalamualaikum.

Sejak broadband dah tak ada ni, Lesya guna wifi Uitm. Baik-baik muka selicin kulit tomato, terus berubah ibarat kertas pasir yang sungguh berpasir. Demm! Tension dengan wifi free ni. Malu sebenarnya nak bagitahu Lesya guna wifi jeee. Maklum la, Lesya tak kaya nak beli broadband mahal-mahal ni. Eh. Tak la. Tipu je. Hehe :)

Lesya nak share satu tutorial dari anarm.net. Cara nak buat shoutbox autohide. Iye. Lesya tahu dah ramai yang dah ajar, tapi saja nak bagi anarm.net jadi famous. Ah. Tipu lagi. ^^

Lagipun, sangat berguna untuk belog ohsem korang nampak kemas. Ehemm..


Jom kita mulakan :)

1. pergi ke layout > page element > gadget

<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/AVvXsEjBjYAFgebSERCtfEARO2GX0gjZHQvdr2c-95tLj9SMpwokW8tPcn9G_UzMuEmxPI-HcZuFHadnZT8w7BzF9SPyGS3-FvJB0EFmIYpt6kWhaQLfeaN9qLvq_VeHTazvcICBOlZ80n3Mke49/s320/tabs.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">

MASUKKAN CODE SHOUTBOX KORANG KAT SINI

<div style="text-align:right">
<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>

Yang 50px tu untuk setkan kedudukan shoutbox korang. Semakin tinggi nombor yang korang setkan, semakin kebawah la dia. Lepas tu masukan kod untuk shoutbox korang ok :)

Dah baca? Belanja la aiskem seposen dibawah ^^