Position eines Elementes ermitteln [Javascript ist Toll!]

Wie kann man alle Einträge aller Selectfelder wählen? »» «« Wie finde ich die Mausposition?

3. Februar 2006 - 11:00

Position eines Elementes ermitteln

Die Position und die Maße eines HTML Elementes, lassen sich mit folgender Funktion bestimmen:

function getRect (o){
    var r = { top:0, left:0, width:0, height:0 };
 
    if(!o) return r;
    else if(typeof o == 'string' ) o = document.getElementById(o);
 
    if( typeof o != 'object' ) return r;
 
    if(typeof o.offsetTop != 'undefined')    {
         r.height = o.offsetHeight;
         r.width = o.offsetWidth;
         r.left = r.top = 0;
         while (o && o.tagName != 'BODY')         {
              r.top  += parseInt( o.offsetTop );
              r.left += parseInt( o.offsetLeft );
              o = o.offsetParent;
         }
    }
    return r;
}

Funktionsweise

Der Funktionsparameter kann wahlweise eine bereits ermittelte Objektreferenz auf ein HTML Element sein oder ein String, der die ID eines Objektes darstellt. Der Rückgabewert ist ein Objekt mit den vier Attributen: left, top, width, height.

8 Kommentare

Leave a comment »

Seiten:

1. Kommentar von: karl123
5. März 2006: 17:31

Hallo Struppi,

ich habe das Script einmal ausprobiert: es funktioniert bei IE6 und Opera 8 perfekt, bei den Gecko-Browsern (Mozilla Firefox 1) aber nicht. Dort passiert garnichts.

Hier mein Testprogramm:

[…. HTML Code gelöscht …]

Karl

2. Kommentar von: karl123
5. März 2006: 18:29

Hallo Struppi,

sieht so aus, als wenn der Quellcode nicht dargestellt wird.
Ich habe ihn daher auf meiner Webseite unter „Problemfälle“ dargestellt.

Karl

3. Kommentar von: Struppi
6. März 2006: 8:10

Das Skript würde funktionieren, ich erhalte aber eine Fehlermeldung:

Fehler: xtr has no properties
Quelldatei: ….

Deine Abfrage nach dem Objekt scheint nicht ok zu sein.

4. Kommentar von: fester_franz
6. März 2006: 10:33

Hallo Struppi,

Vieln Dank für dieses geniale Skript, das hat mir viel Zeit gespart…

fester_franz

5. Kommentar von: steve
14. August 2006: 3:04

maozilla-browser koennen mit der uebergeben
objekt-referenz nix anfangen. ich bin daher
den weg der uebergabe einer element-id und resultierend die referenzierung mit hilfe
von „objRef = getElementById(varRefID)“. mozilla >= 1 verstehts…regards steve

6. Kommentar von: Struppi
14. August 2006: 10:25

Die Mozillabrowser, die ich benutze können sehr wohl etwas mit einer Objektreferenz anfangen.

7. Kommentar von: vtiger
9. März 2010: 13:42

super script… vielen dank an alle helfer
grüsse

8. Kommentar von: lemmmi
6. Mai 2012: 9:25

Danke… :-)

Schreibe einen Kommentar Antworten abbrechen

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden.

Stop Spam Harvesters, Join Project Honey Pot

marketing-bankruptcy

Javascript ist Toll!