/*
ToolTip-Javascript
tooltip.js
Description: Erzeugt ToolTip-Box (ähnlich QuickInfo), die Mauszeiger folgt.
Implementierung:
im head:
.toolTipClass {
position:absolute;
visibility: hidden;
width:300px;
padding:2px;
text-align:justify;
border-style:solid;
border-width:1px;
}
#toolTipBg {
opacity:0.85;
-moz-opacity:0.85;
filter:Alpha(opacity=90, finishopacity=65, style=1, finishx=0, finishy=100, startx=0, starty=0);
}
im body:
Funktionen/Verwendung;
initToolTips()
Initialisierung, sollte ganz am Anfang aufgerufen werden (siehe Implementierung)
Argumente: keine
toolTip(msg, fg, bg)
Erzeugt ToolTip. Sinnvoll in Eventhandler (zB onmouseover).
Argumente:
msg: Inhalt des ToolTips, kann auch Tags enthalten
fg: Foreground-color
bg: Background-color
fg und bg sind optionale Argumente, wenn nicht angegeben, ist ToolTip weiß mit dunkelgrauem foreground.
Aufruf von toolTip ohne Argumente lässt ToolTip wieder verschwinden (sinnvoll zB in onmouseout)
moveToMouseLoc(e)
Interne Funktion die bewirkt, dass ToolTip der Mausbewegung folgt (solange nicht toolTip() aufgerufen wird)
Argumente:
e: Objekt, das Event beschreibt
Da interne Funktion, kein expliziter Aufruf notwendig
Das Copyright dieser Version liegt bei Martin Schenk (ms): martin.schenk@popperschule.at
*******************************************
Last edited: 22.01.2005
Version: 0.1
Version History:
0.1 (ms): Initial Version
*/
var ns4 = document.layers;
var ns6 = document.getElementById && !document.all;
var ie4 = document.all;
offsetX = 0;
offsetY = -5;
var toolTipSTYLE="";
var direction = 0;
function initToolTips() {
if(ns4||ns6||ie4) {
if(ns4) {
toolTipSTYLE = document.toolTipLayer;
toolTipBgSTYLE = document.toolTipBg;
}
if(ns6) {
toolTipSTYLE = document.getElementById("toolTipLayer").style;
toolTipBgSTYLE = document.getElementById("toolTipBg").style;
}
if(ie4) {
toolTipSTYLE = document.all.toolTipLayer.style;
toolTipBgSTYLE = document.all.toolTipBg.style;
}
if(ns4) document.captureEvents(Event.MOUSEMOVE);
else
{
toolTipSTYLE.visibility = "visible";
toolTipSTYLE.display = "none";
toolTipBgSTYLE.visibility = "visible";
toolTipBgSTYLE.display = "none";
}
document.onmousemove = moveToMouseLoc;
}
}
function toolTip(msg, fg, bg, dir)
{
direction = dir;
if(toolTip.arguments.length < 1) // hide
{
if(ns4) {
toolTipSTYLE.visibility = "hidden";
toolTipBgSTYLE.visibility = "hidden";
} else {
toolTipSTYLE.display = "none";
toolTipBgSTYLE.display = "none";
}
} else {// show
if(!fg) fg = "#777777";
if(!bg) bg = "#FFFFFF";
var content="" + msg + "";
if(ns4)
{
toolTipSTYLE.document.write(content);
toolTipBgSTYLE.document.write(content);
toolTipSTYLE.document.close();
toolTipSTYLE.visibility = "visible";
toolTipBgSTYLE.visibility = "visible";
toolTipBgSTYLE.backgroundColor = bg
}
if(ns6)
{
document.getElementById("toolTipLayer").innerHTML = content;
document.getElementById("toolTipBg").innerHTML = content;
toolTipSTYLE.borderColor = fg;
toolTipSTYLE.display='block';
toolTipBgSTYLE.display='block';
toolTipBgSTYLE.backgroundColor = bg;
}
if(ie4)
{
document.all("toolTipLayer").innerHTML=content;
document.all("toolTipBg").innerHTML=content;
toolTipSTYLE.borderColor = fg;
toolTipSTYLE.display='block';
toolTipBgSTYLE.display='block';
toolTipBgSTYLE.backgroundColor = bg;
}
}
}
function moveToMouseLoc(e)
{
if(ns4||ns6)
{
if (direction != 0) {
x = e.pageX - 300;
} else {
x = e.pageX;
}
y = document.body.clientHeight - e.pageY - offsetY;
}
else
{
if (direction != 0) {
x = event.x + document.body.scrollLeft - 300;
} else {
x = event.x + document.body.scrollLeft;
}
y = document.body.clientHeight - event.y - offsetY;
}
if (x < 24) { x = 24; }
if (x > document.body.clientWidth - 324) {
x = document.body.clientWidth - 324;
}
toolTipSTYLE.left = x + offsetX;
toolTipSTYLE.bottom = y;
toolTipBgSTYLE.left = x + offsetX;
toolTipBgSTYLE.bottom = y;
return true;
}