Prepare un script que automaticamente lee todos los objetos de la pagina que tengan el atributo "title", borra el atributo y al hacer "onmouseover" sobre los objetos, se muestra un tooltip con el contenido de title.
El script hace lo que debe, pero tengo problemas para hacer que se posicione junto al mouse, quizas porque no interprete bien el codigo de donde tome esa parte, en esta pagina.
Aqui el script tal como lo tengo, a ver si me sugieren en que puedo estar mal:
Código PHP:
function setAllTitles ()
{
var objs = document.getElementsByTagName('*');
//
for (var i = 0; i < objs.length; i++)
{
if (objs[i].title)
{
showTT (objs[i]);
}
}
//
function showTT (ob)
{
var tit = ob.title;
ob.removeAttribute ("title");
//
ob.onmouseover = function ()
{
var tt = document.createElement ('div');
tt.style.backgroundColor = '#000';
tt.style.fontSize = '9px';
tt.style.color = '#FFF';
tt.style.border = 'solid 1px #FFF';
tt.style.padding = '6px 6px 4px 6px';
tt.style.position = 'fixed';
tt.style.zIndex = '5000';
tt.style.borderRadius = '4px';
tt.style.MozBorderRadius = '4px';
tt.style.WebkitBorderRadius = '4px';
tt.style.KhtmlBorderRadius = '4px';
tt.id = 'lyrtooltip';
tt.innerHTML = tit;
document.body.appendChild (tt);
tt.style.zoom = 1;
//
// Calcular posicion del mouse
//
var posx = 0, posy = 0;
var e = window.event;
//
if (e.pageX || e.pageY)
{
posx = e.pageX;
posy = e.pageY;
}
else if (e.clientX || e.clientY)
{
posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
}
//
tt.style.top = parseInt (posy) + 'px';
tt.style.left = parseInt (posx) + 'px';
}
//
ob.onmouseout = function ()
{
document.body.removeChild (document.getElementById('lyrtooltip'));
}
}
}