How to show tool tip using Java script?

When we consider drop down list or list box, user selects a specific option it might be required to display tool tip of the selected option.
Where as components like link button, button, check box, etc... Which always display static text or mean for static role it is easy to assign tool tip either using title or tool tip attribute.
So now comes into picture drop down list or list box whose tool tip should be dynamic based upon selected option. Obviously, we should write a java script function that has to called on change and on mouse over event of drop down list and list box. To display tool tip, label or div can be used whose position is absolute (position can be changed but not fixed). To assign this position as absolute, use style attribute of the label or div.
Ex:-

I have a list box which populates data dynamically



In aspx.cs or code behind page I can write code to connect to data base and load some business related data into this list box.

Observe I have included 3 events (onmouseover,onchange,onmouseout).
onmouseover,onchange – to display tool tip
onmouseout – to hidetooltip

Java script function that displays tool tip of the component on a div whose position is absolute.
Since div position is absolute , I am changing its top and left attributes based upon client x and y coordinates.

function showTip(oSel)
{

var theTip = document.getElementById("div_Tooltip");
theTip.style.top = window.event.clientY + 20;
theTip.style.left = window.event.clientX;
if(oSel.selectedIndex!=-1 && oSel.options[oSel.selectedIndex]!=null)
{
theTip.innerText = oSel.options[oSel.selectedIndex].text;
theTip.style.visibility = "visible";
}
else
{
theTip.style.visibility = "hidden";
}
}

Java script function to hide the tool tip.
function hideTip()
{
document.getElementById("div_Tooltip ").innerText=’’;
document.getElementById("div_Tooltip ").style.visibility = "hidden";
}