// Thanks to the author of
// http://www.texsoft.it/index.php?c=software&m=sw.js.htmltooltip&l=it
//
// This defines the text of a tooltip:
//
Hi how are you
// Add the following attributes to an img element (only works with
// a hyperlink!)
// id="abc"
// onmouseover="xstooltip_show('tt-abc', 'abc',0,30);"
// onmouseout="xstooltip_hide('tt-abc');"
// With a reference syntax from your html document such as
//
// put the following segment of code in the referenced style sheet
// .xstooltip {
// visibility: hidden;
// position: fixed;
// z-index: 2;
// top: 0;
// left: 0;
// background: cyan;
// font: normal 18pt sans-serif;
// padding: 3px;
// border: solid 1px;
// }
// Add this to the of the html document
//
// The following is the content of xstooltip.js
function xstooltip_findPosX(obj)
{
var curleft = 0;
if (obj.offsetParent)
{
while (obj.offsetParent)
{
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}
else if (obj.x)
curleft += obj.x;
return curleft;
}
function xstooltip_findPosY(obj)
{
var curtop = 0;
if (obj.offsetParent)
{
while (obj.offsetParent)
{
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}
else if (obj.y)
curtop += obj.y;
return curtop;
}
function xstooltip_show(tooltipId, parentId, posX, posY)
{
it = document.getElementById(tooltipId);
if ((it.style.top == '' || it.style.top == 0)
&& (it.style.left == '' || it.style.left == 0))
{
// need to fixate default size (MSIE problem)
it.style.width = it.offsetWidth;
it.style.height = it.offsetHeight;
img = document.getElementById(parentId);
// if tooltip is too wide, shift left to be within parent
if (posX + it.offsetWidth > img.offsetWidth) posX = img.offsetWidth - it.offsetWidth;
if (posX < 0 ) posX = 0;
x = xstooltip_findPosX(img) + posX;
y = xstooltip_findPosY(img) + posY;
it.style.top = y.toString() + 'px';
it.style.left = x.toString() + 'px';
}
it.style.visibility = 'visible';
}
function xstooltip_hide(id)
{
it = document.getElementById(id);
it.style.visibility = 'hidden';
}