// original code by Stuart Langridge 2003-11






div.nicetitle {
    position:absolute;
    padding:4px;
    top:0px;
    left:0px;
    color:#ffffff;
    font-size: 13px;
    font-family:Verdana, Helvetica, Arial, sans-serif;
    width:25em;
    font-weight:bold;
    border-radius:12px;
}
div.nicetitle p {
    margin:0; padding:0 3px;
}
div.nicetitle p.destination {
    font-size:9px;
    text-align:left;
    padding-top:3px;
}
div.nicetitle {
	background-color:#333;
	opacity:0.8;
	color: #fff;
	font:12px/1.8em Verdana;
	left:0;
	padding:4px;
	position:absolute;
	top:0;

	z-index: 20;
	border-radius:0 5px 5px 5px;
}
div.nicetitle p {
    margin:0;
	padding:0 3px;
	opacity:1;
}



<a href="#" title="hey !">test!</a>




addEvent(window, "load", makeNiceTitles);
var XHTMLNS = "http://www.w3.org/1999/xhtml";
var CURRENT_NICE_TITLE;
var browser = new Browser();

function makeNiceTitles(){if(document.createElement&&document.getElementsByTagName){document.createElementNS||(document.createElementNS=function(a,b){return document.createElement(b)});document.links||(document.links=document.getElementsByTagName("a"));for(var a=0;a<document.links.length;a++){var b=document.links[a];b.title&&(b.setAttribute("nicetitle",b.title),b.removeAttribute("title"),addEvent(b,"mouseover",showNiceTitle),addEvent(b,"mouseout",hideNiceTitle),addEvent(b,"focus",showNiceTitle),addEvent(b, "blur",hideNiceTitle))}if(b=document.getElementsByTagName("ins"))for(a=0;a<b.length;a++){var c=b[a];if(c.dateTime){var d=c.dateTime,d=new Date(d.substring(0,4),parseInt(d.substring(4,6)-1),d.substring(6,8),d.substring(9,11),d.substring(11,13),d.substring(13,15));c.setAttribute("nicetitle","Added on "+d.toString());addEvent(c,"mouseover",showNiceTitle);addEvent(c,"mouseout",hideNiceTitle);addEvent(c,"focus",showNiceTitle);addEvent(c,"blur",hideNiceTitle)}}}} function findPosition(a){if(a.offsetParent){for(var b=0,c=0;a.offsetParent;a=a.offsetParent)b+=a.offsetLeft,c+=a.offsetTop;return[b,c]}return[a.x,a.y]};

function showNiceTitle(e) {
    if (CURRENT_NICE_TITLE) hideNiceTitle(CURRENT_NICE_TITLE);
    if (!document.getElementsByTagName) return;
    if (window.event && window.event.srcElement) {
        lnk = window.event.srcElement
    } else if (e && e.target) {
        lnk = e.target
    }
    if (!lnk) return;
    if (lnk.nodeName.toUpperCase() != 'A') {
        lnk = getParent(lnk,"A");
    }
    if (!lnk) return;
    nicetitle = lnk.getAttribute("nicetitle");
    
    var d = document.createElementNS(XHTMLNS,"div");
    d.className = "nicetitle";
    tnt = document.createTextNode(nicetitle);
    pat = document.createElementNS(XHTMLNS,"p");
    pat.className = "titletext";
    pat.appendChild(tnt);
    d.appendChild(pat);
    
    STD_WIDTH = 300;
    h = nicetitle.length;
	t = nicetitle.length;

    h_pixels = h*6; t_pixels = t*10;
    
	w=h_pixels>STD_WIDTH?h_pixels:STD_WIDTH>t_pixels&&t_pixels>h_pixels?t_pixels:STD_WIDTH>t_pixels&&h_pixels>t_pixels?h_pixels:STD_WIDTH;
        
    d.style.width = w + 'px';    

    //mx = lnk.offsetLeft;
    //my = lnk.offsetTop;

    mpos = findPosition(lnk);
    mx = mpos[0];
    my = mpos[1];
    //xy = getMousePosition(e);
    //mx = xy[0]; my = xy[1];
    
    d.style.left = (mx+30) + 'px';
    d.style.top = (my+15) + 'px';
    if (window.innerWidth && ((mx+w) > window.innerWidth)) {
        d.style.left = (window.innerWidth - w - 25) + "px";
    }
    if (document.body.scrollWidth && ((mx+w) > document.body.scrollWidth)) {
        d.style.left = (document.body.scrollWidth - w - 25) + "px";
    }
    
    document.getElementsByTagName("body")[0].appendChild(d);
    
    CURRENT_NICE_TITLE = d;
}

function hideNiceTitle(){document.getElementsByTagName&&CURRENT_NICE_TITLE&&(document.getElementsByTagName("body")[0].removeChild(CURRENT_NICE_TITLE),CURRENT_NICE_TITLE=null)}function addEvent(a,b,c){return a.addEventListener?(a.addEventListener(b,c,!1),!0):a.attachEvent?a.attachEvent("on"+b,c):!1}function getParent(a,b){return null==a?null:1==a.nodeType&&a.tagName.toLowerCase()==b.toLowerCase()?a:getParent(a.parentNode,b)} function getMousePosition(a){browser.isIE&&(x=window.event.clientX+document.documentElement.scrollLeft+document.body.scrollLeft,y=window.event.clientY+document.documentElement.scrollTop+document.body.scrollTop);browser.isNS&&(x=a.clientX+window.scrollX,y=a.clientY+window.scrollY);return[x,y]} function Browser(){var a,b,c;this.isNS=this.isIE=!1;this.version=null;a=navigator.userAgent;b="MSIE";0<=(c=a.indexOf(b))?(this.isIE=!0,this.version=parseFloat(a.substr(c+b.length))):(b="Netscape6/",0<=(c=a.indexOf(b))?(this.isNS=!0,this.version=parseFloat(a.substr(c+b.length))):0<=a.indexOf("Gecko")&&(this.isNS=!0,this.version=6.1))};
