<html>
<head>
<script>
var interval;
function showTip(toolTipId, show)
{
var tooltip = eval(toolTipId);
if(show)
{
var mousex = event.x;
var mousey = event.y;
tooltip.style.display = 'inline';
[b]//You'll want to test these placement adjustments and
// add additional ones for proximity to the bottom of the page[/b]
if(mousey - tooltip.offsetHeight < 0)
tooltip.style.top = mousey;
else
tooltip.style.top = mousey - tooltip.offsetHeight;
if(mousex + tooltip.offsetWidth > document.body.clientWidth)
tooltip.style.left = document.body.clientWidth - tooltip.offsetWidth;
else
tooltip.style.left = mousex;
tooltip.style.visibility = 'visible';
[b]//change the 5000 to whatever you like to control
// the 'hang-time'[/b]
interval = setInterval('showTip('+toolTipId+', false);',[b]5000[/b]);
}//end if
else
{
tooltip.style.visibility = 'hidden';
tooltip.style.display = 'none';
clearInterval(interval);
}//end else
}//end showTip(var, var)
</script>
</head>
<body>
<span name='fname' onmouseover='showTip("fnameTooltip",true);' onmouseout='showTip("fnameTooltip",false);'>First name: <input type='text' name='fnameField' size='20' /></span>
<span name='lname' onmouseover='showTip("lnameTooltip",true);' onmouseout='showTip("lnameTooltip",false);'>Last name: <input type='text' name='lnameField' size='20' /></span>
<div id='fnameTooltip' style='position:absolute;display:none;visibility:hidden;background:yellow;'>This is where you enter your <i>first name</i>.</div>
<div id='lnameTooltip' style='position:absolute;display:none;visibility:hidden;background:yellow;'>This is where you enter your <i>last name</i>.</div>
</body>
</html>
