Primero van a es añadir un nuevo gadget javascrip y pegar este código
<center>
<style type="text/css">
#at{
position:fixed;
right:250px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:none;
background: repeat-x bottom center scroll ;
-moz-border-radius:20px;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:url() no-repeat;">
<div style="text-align: center;">
<div class="separator" style="clear: both; text-align: center;">
<br />
<form name="news">
<textarea rows="1" style="border:3px double #E3CEF6;-moz-box-shadow: 0 0 15px 5px #E3CEF6;
-webkit-box-shadow: 0 0 15px 5px #E3CEF6;border-radius:7px;font-size:12px;font-family:century gothic;cursor:crosshair;" cols="30" name="news2" wrap="virtual"></textarea>
<script language="JavaScript">
var newsText = new Array();
newsText[0] = "TEXTO";
newsText[1] = "TEXTO";
newsText[2] = "TEXTO";
newsText[3] = "TEXTO";
newsText[4] = "TEXTO";
newsText[5] = "TEXTO";
newsText[6] = "TEXTO";
newsText[7] = "TEXTO";
var ttloop = 1; //
var tspeed = 70; //
var tdelay = 1000; //
// ------------- CANNOT EDITING ------------- \
var dwAText, cnews=0, eline=0, cchar=0, mxText;
function doNews() {
mxText = newsText.length - 1;
dwAText = newsText[cnews];
setTimeout("addChar()",1000)
}
function addNews() {
cnews += 1;
if (cnews <= mxText) {
dwAText = newsText[cnews];
if (dwAText.length != 0) {
document.news.news2.value = "";
eline = 0;
setTimeout("addChar()",tspeed)
}
}
}
function addChar() {
if (eline!=1) {
if (cchar != dwAText.length) {
nmttxt = ""; for (var k=0; k<=cchar;k++) nmttxt += dwAText.charAt(k);
document.news.news2.value = nmttxt;
cchar += 1;
if (cchar != dwAText.length) document.news.news2.value += "_";
} else {
cchar = 0;
eline = 1;
}
if (mxText==cnews && eline!=0 && ttloop!=0) {
cnews = 0; setTimeout("addNews()",tdelay);
} else setTimeout("addChar()",tspeed);
} else {
setTimeout("addNews()",tdelay)
}
}
doNews()
</script>
</form>
</div>
Cbox CODIGO</div>
</div>
<br />
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><div >
<span ></span></div></a></div>
</div></div>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>
<a href="javascript:void(0);"onclick="showHideAT()"/><img class="expando" src="Url de la imagen de cbox" alt="PUSH" title="Click"style='position:fixed; top:0; right:50px;'/></a>
</div></center>
Amarillo:El color de la caguita del mensaje
Naranja:Codigo de la cbox
Rojo:url de la imagen de cbox