Hint personalizado no Link em JavaScript

Hoje vou mostrar como personalizar o HINT dos links de uma página com JavaScript.
Posicione o mouse sobre o link para ver... Se não aparecer o teto do hint, pode ser devido ao seu navegador ter alguma restrição à JS. Mas copie e cole o código abaixo no Bloco de Notas e salve com a extensão ".htm" e, depois de salvar, abra em outro navegador para testar!

Este é um link

Passe o mouse aqui

O Código Fonte:
<div id="link" style="background-color: #9900ff; border: 1px none #000000; left: 52px; position: absolute; top: 16px; visibility: hidden; z-index: 1;">
<span style="color: white; font-family: Verdana; font-size: xx-small;">Este é um link</span>
</div>
<script language="JavaScript" type="text/JavaScript">
//detectando navegador
sAgent = navigator.userAgent;
bIsIE = sAgent.indexOf("MSIE") > -1;
bIsNav = sAgent.indexOf("Mozilla") > -1 && !bIsIE;

//setando as variaveis de controle de eventos do mouse
var xmouse = 0;
var ymouse = 0;
document.onmousemove = MouseMove;

//funcoes de controle de eventos do mouse:
function MouseMove(e){
 if (e) { MousePos(e); } else { MousePos();}
}

function MousePos(e) {
 if (bIsNav){
  xmouse = e.pageX;
  ymouse = e.pageY;
 }
 if (bIsIE) {
  xmouse = document.body.scrollLeft + event.x;
  ymouse = document.body.scrollTop + event.y;
 }
}

//funcao que mostra e esconde o hint
function Hint(objNome, action){
 //action = 1 -> Esconder
 //action = 2 -> Mover

 if (bIsIE) {
  objHint = document.all[objNome];
 }
 if (bIsNav) {
  objHint = document.getElementById(objNome);
  event = objHint;
 }

 switch (action){
  case 1: //Esconder
   objHint.style.visibility = "hidden";
   break;
  case 2: //Mover
   objHint.style.visibility = "visible";
   objHint.style.left = xmouse + 15;
   objHint.style.top = ymouse + 15;
   break;
 }

}

</script>
<a href="https://www.blogger.com/" onmousemove="Hint('link',2)" onmouseout="Hint('link',1)">Passe o mouse aqui</a>