<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<STYLE>
<!--
#tipbox {position: absolute; z-index: 100;border: 1pt black solid; background: #FFFFD0; visibility: hidden; font-size:8pt; font-family: "verdana, arial"; color:#000000 }
-->
</STYLE>
<SCRIPT type=text/JavaScript>
<!--
var tID;
var opacityID;
function showObject(e,outtxt)
{
if (window.tID) clearTimeout(tID); //Clear any existing timer.
if ( window.opacityID ) {
clearTimeout(opacityID);
}
// Get the object based on browser implementation.
if (!e) var e = window.event;
if (e.target) var obj = e.target;
else if (e.srcElement) var obj = e.srcElement;
if (obj.nodeType == 3) var obj = obj.parentNode; // for Safari bug
obj.style.cursor='pointer';
var tipBox = document.getElementById('tipbox');
setPosition(obj,tipBox);
tipBox.innerHTML = outtxt;
tipBox.style.visibility = "Visible";
tipBox.style.opacity = '.1';
tipFade(10);
}
function setPosition(obj,tipBox)
{
var scrWidth = document.body.scrollWidth -10; // The -10 keeps the box from reaching the edge of the screen.
var lftOffset = getOffset(obj, "Left");
var boxWidth = tipBox.style.width.substring(0,tipBox.style.width.length-2); // The width set for the tipBox
var totWidth = lftOffset + (boxWidth-0);
if (totWidth > scrWidth) lftOffset = lftOffset - (totWidth - scrWidth); //Subtracts pixels to keep box 10px within right of window.
if (lftOffset < 0) lftOffset = 0;
if (document.captureEvents) {
tipBox.style.left = lftOffset;
tipBox.style.top = getOffset(obj, "Top");
}
else if ( window.event.clientX ) {
tipBox.style.pixelLeft = lftOffset;
tipBox.style.pixelTop = getOffset(obj, "Top");
}
}
function getOffset(obj,which) { // Calculate and return the top and left position of an element relative to window.
var amount = obj["offset"+which];
if (which=="Top") amount+=obj.offsetHeight;
obj = obj.offsetParent;
while (obj!=null) {
amount+=obj["offset"+which];
obj = obj.offsetParent;
}
return amount;
}
function hideObject() {
document.getElementById('tipbox').style.visibility = "hidden";
}
function closeTip() {
tID = window.setTimeout("hideObject()",500);
}
function tipFade(opac) {
var passed = parseInt(opac);
var newOpac = parseInt(passed+10);
var tipBox = document.getElementById('tipbox');
if (newOpac < 80) {
tipBox.style.opacity = '.'+newOpac;
tipBox.style.filter = "alpha(opacity:"+newOpac+")";
opacityID = window.setTimeout("tipFade('"+newOpac+"')",20);
}
else {
tipBox.style.opacity = '.80';
tipBox.style.filter = "alpha(opacity:80)";
}
}
//-->
</SCRIPT>
<!-- <DIV ID='tipbox' Style="width: 520"></div> -->
<DIV id=tipbox style="VISIBILITY: hidden"></DIV><B>Table cells</B><BR>
<TABLE width="100%" border=1>
<TR>
<TD id="one" onmouseover="showObject(event,'This is the long description for #1'); this.style.background = '#FFFFD0'" onmouseout="closeTip(); this.style.background = 'white'" align=left bgColor=#ffffff><FONT face="Verdana, Arial, Helvetica" size=1>Short description #1</FONT></TD>
<TD id="two" onmouseover="showObject(event,'This is the long description for #2'); this.style.background = '#FFFFD0'" onmouseout="closeTip(); this.style.background = 'white'" align=left bgColor=#ffffff><FONT face="Verdana, Arial, Helvetica" size=1>Short description #2</FONT></TD>
<TD id=three onmouseover="showObject(event,'This is the long description for #3'); this.style.background = '#FFFFD0'" onmouseout="closeTip(); this.style.background = 'white'" align=left bgColor=#ffffff><FONT face="Verdana, Arial, Helvetica" size=1>Short description #3</FONT></TD>
</TR>
</TABLE>
<BR><BR>
<B>Text within a span tag</B>
<BR>
<SPAN onmouseover="showObject(event,'This is the long description for #1');" onmouseout=closeTip();>Short description #1</SPAN><BR><BR>
<SPAN onmouseover="showObject(event,'This is the long description for #2');" onmouseout=closeTip();>Short description #2</SPAN><BR><BR>
<SPAN onmouseover="showObject(event,'This is the long description for #3');" onmouseout=closeTip();>Short description #3</SPAN><BR><BR>
<BR><BR>
<B>Links</B><BR><A onmouseover="showObject(event,'This is the long description for #1');" onmouseout=closeTip(); href="#">Short description #1</A><BR><BR>
<A onmouseover="showObject(event,'This is the long description for #2');" onmouseout=closeTip(); href="#">Short description #2</A><BR><BR>
<A onmouseover="showObject(event,'This is the long description for #3');" onmouseout=closeTip(); href="#">Short description #3</A><BR><BR>
</BODY>
</HTML>