Ocultar chatbox con una imagen

Hola chicos hoy aprenderemos a ocultar el chat con una imagen justo como yo lo tengo ^^!!

--------------------->

El truco es muy facil ya lo veran n *w*

okii para empezar nos vamos a:

Diseño >> Elementos de la pagina >> Añadir un gadget Htlm/javascript

copia el siguiente codigo y guarda:

<style type="text/css">

#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:400px;
width:150px;
float:left;
cursor:pointer;
background:url('URL DE LA IMAGEN') 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, 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">

pega el codigo de tu cbox

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

Remplaza donde dice URL DE LA IMAGEN por la url de la imagen de tu preferencia. Pega el codigo de tu cbox donde dice CODIGO DE CBOX.!!

Este tutorial lo viste en Annyz Kawaii Blog, no copies mi trabajo, si tomas el tuto no olvides los creditos !!

besos ^w^