Tutorial hidden shoutbox with cute picture

hai everyone.ok harini nina nak memenuhi permintaan chea.sori ye lambat sikit. nina baru perasan awak submit form dekat saya.jom mulakan..

dashboarddesignpage elementadd gadgetHTML/JAVASCRIPT

copy code kat bawah ni dan pastekan dekat HTML JAVASCRIPT tu

<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('URL GAMBAR') no-repeat;

}

.gbcontent{

float:left;

border:2px solid #F9B7FF;

background:white;

padding:0px;

}

</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">

URL SHOUTBOX ANDA

<div style="text-align:right">

<a href="javascript:showHideGB()" tip="">

[close]

</a></div>

</div>

</div>

<script type="text/javascript">

var gb = document.getElementById("gb");

gb.style.right = (30-gb.offsetWidth).toString() + "px";

</script>

warna purple tu width and height untuk gambar

warna emas tu url gambar yang korang nak

warna merah tu, kalau kau kena adjust sikit. sebab kadang kadang gambar tu boleh tersorok tak tunjuk sepenuhnya gambar tu dan kadang kadang dia tutup pun tak habis

save lah