tutorial sembunyikan shoutbox

hye dear..malam nih ftin nak buad tutorial psal shoutbox oke..korang mesti prasankan bila kta jlan2 kt belog org msti ada hide shoutbox..mcm mna diorg buad ?..dh lha icon tepi shoutbox tu cntek..teringin lha nak buad..oke ! klau korg tringin sgt..korg tgok tuto ftin oke..:)


dashboard~design~add gadget~html javascript
copy code kat bwh nih..

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:350px;
width:140px;
float:left;
cursor:pointer;
background:url('URL GAMBAR SHOUTBOX')
 no-repeat;
}
.gbcontent{
float:left;
border:2px solid #00000;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 150-w) : moveGB(170-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">

SHOUTBOX CODE


<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 = (140-gb.offsetWidth).toString() + "px";
</script>

warna merun tu korang letak url picture gmbr tpi tu tw..
warna merah plak korang punya code shoutbox..


oke try lha..klau ta jdi korg ckp kt ftin tw..oke dear !
selamat mencuba