I guess unless you were working as a team on a huge project with lots of external scripts you would do something like this:
<head>
<style>
#ms{
height:200px;
width:200px;
border:solid;
display:none;
}
</style>
</head>
<body>
<a id="googlelink" href="http://www.google.com">link1: go to google</a><br>
<a id="yahoolink" href="http://www.yahoo.com">link2: go to yahoo</a>
<div id="ms">
<span id="cont"></span>
</div>
<script>
var messageBox=document.getElementById("ms");
var contents=document.getElementById("cont");
var as = document.getElementsByTagName("a");
for(var i = 0; i<as.length; i++){
as[i].onmouseover=function () {
var msgs={
"googlelink":"this is the google message",
"yahoolink":"this is the yahoo message"
}
var obj=this;
var msg = msgs[obj.id];
messageBox.style.top=obj.offsetTop;
messageBox.style.left=obj.offsetLeft+obj.offsetWidth+5;
contents.innerHTML=msg+"<p>"+obj.href+"</p>";
messageBox.style.display="block";
}
as[i].onmouseout=function () {
messageBox.style.display='none';
}
}
</script>
</body>
