Hallo,
mir will es einfach nicht gelingen, dass ein DiV in der Zeile angezeigt wird, wo der Anwender klickt. Ich habe eine ziemlich lange Tabelle, in der jede Zeile (also jeder TR-Tag) eine eindeutige ID erhalten hat. Klickt der Anwender auf eine Spalte, sollen Zusatzinformationen angezeigt werden.
Problem Nr. 1: Je weiter nach unten gescrollt wird, desto mehr fehlt der Y-Position, wird also zu hoch angezeigt. Problem Nr. 2: Wenn der Anwender auf der unteren Hälfte des Bildschirms klickt, soll das Fenster nach oben versetzt werden, da das Fenster ja sonst womöglich auch wieder aus dem sichtbaren Bereich ragt.
So ermittle ich die Y-Position:
e = document.getElementById(id);
var offset = {x:0,y:0};
while (e)
{
offset.x += e.offsetLeft;
offset.y += e.offsetTop;
e = e.offsetParent;
}
if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft))
{
offset.x -= document.documentElement.scrollLeft;
offset.y -= document.documentElement.scrollTop;
}
else if (document.body && (document.body.scrollTop || document.body.scrollLeft))
{
offset.x -= document.body.scrollLeft;
offset.y -= document.body.scrollTop;
}
else if (window.pageXOffset || window.pageYOffset)
{
offset.x -= window.pageXOffset;
offset.y -= window.pageYOffset;
}
pluswert = Math.abs(offset.y);
var _x = 0;
var _y = 0;
bodyRect = document.body.getBoundingClientRect(),
elemRect = element.getBoundingClientRect(),
_y = elemRect.top - bodyRect.top;
_x = elemRect.left - bodyRect.left;
if (_y > window.outerHeight / 2) { // Cursor auf unterer Bildschirmhälfte
minuswert = 500;
}
zielx = _x+0+"px";
ziely = _y+21-minuswert+pluswert+"px";
zieldiv.style.top = ziely;
zieldiv.style.left = zielx;
Vielleicht kann mir jemand helfen, wie ich die Position fehlerfrei ermitteln kann?
LG Marvin