Tutorial : Float Shoutbox with background

Fuhhhh.. memang bz sangat la minggu nie.. hmm jarang update blog.. penat niaga...
Cik Waniey ada request tuto cara wat shoutbox cam kat blog cik emma nie...

Cam besa go to dashboard >> design >> Add A Gadget >> HTML/Javascript

letak kod nie

<style type="text/css">
#gb{
position: fixed;
top: 50px;
z-index: +1000;
}
* html #gb{position:relative;}

.gbtab{
height: 145px;
width: 65px;
float: left;
cursor: pointer;
background: url('URL TABS') no-repeat;
}
.gbcontent{
float: left;
border: 2px solid #666666;
background: #000000;
padding: 10px;
}
</style>



<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 65-w) : moveGB(65-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">

KOD SHOUTMIX KORANG

</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (65-gb.offsetWidth).toString() + "px";
</script>

URL TABS LEH DAPAT KAT  SINI JUST COPY IMAGE URL .


BACKGROUND COLOR LEH TUKAR IKUT SUKA YER :))

DONE..SAVE!!