Display ToolTip in Javascripts

Following are the HTML and Javascripts code to display tooltip:

Html Code ---

<span id="spanName" style="font-weight: bold;" onmouseover="javascripts:DisplayToolTip('true');"
onmouseout="javascripts:DisplayToolTip('false');"></span>


<div id="divToolTip" style="position: absolute; display: none; z-index: 20;
background-color: #FFFFE1; border: solid 1px Black;">
</div>


<script type="text/javascript">
function DisplayToolTip(flag)
{
document.getElementById('divToolTip').style.left = window.event.x;
document.getElementById('divToolTip').style.top = window.event.y;

if(flag == 'true')
document.getElementById('divToolTip').style.display = 'block';
else if(flag == 'false')
document.getElementById('divToolTip').style.display = 'none';
}
</script>

Following image, shows how the ToolTip will appear after implementing the above code: