Alexander Kiel: Scrollposition in «div style="overflow:scroll"»

Beitrag lesen

Hallo CSS/JS Junkies,

ihr wundert euch sicherlich, dass ich mir selber antworte. Es ist im Grund ganz einfach, weil ich mein Problem selber gelöst habe (man lert nie aus).

Für alle die es interessiert:

Wie weit der User gescrollt hat bekommt man über die unterschiedlichen Koordinaten der Mausposition heraus.
Da gibt es window.event.x/window.event.y, welche die Koordinaten bezüglich des <body> objekts sind.
Desweiteren gibt es window.event.offsetX/window.event.offsetX (wobei das X und Y groß geschrieben werden muß), welche die Koordinaten bezüglich des Objektes, über dem sich der Mauszeiger befindet, darstellen.
Wenn sich der Mauszeiger über dem Objekt, welches im overflow-div den overflow erzeugt, befindet, dann steht in .x der Abstand zum <body> und in .offsetX der Abstand zur Oberkante diese Objektes.
Wenn der User noch nicht gescrollt hat ist .x=.offsetX+Abstand Oberkante overflow-div zu <body>.
Wenn gescrollt wurde ist .offsetX größer als der Abstand Maus zu Oberkante overflow-div.
Mit den Formeln:
scrollx=window.event.offsetX-window.event.x+document.all.scrolldiv.style.Left+2;
scrolly=window.event.offsetY-window.event.y+document.all.scrolldiv.style.Top+2;
kann man die Verscrollungen berechnen.
scrolldiv ist der name des overflow-divs und die 2 ergibt sich bei mir so(keine Ahnung)

Mit dem Event onscroll kann man das scrollen abfangen und wenn die Maus dann mal über dem Objekt im div ist (onmouseover) kann man die Werte berechnen.

Ich hoffe, dass dies mal jemand gebrauchen kann.

Umfangreiche Dokumentationen über die Objektstrucktur gibt es unter http://msdn.microsoft.com/workshop/author/dhtml/reference/dhtmlrefs.asp

Tschüss

Alex