Axel: JS und CSS Layout - Einheitenproblem

Beitrag lesen

Hallo Leute,

ich habe ein kleines (grosses) Problem. Vielleicht liegt da schon ein konzeptioneller Fehler vor, und vielleicht könnt Ihr mir helfen.

Ich habe mein Layout komplett mit CSS mit der Einheit "em" erstellt. Dadurch möchte ich erreichen, dass die gesamte Layout bei Änderungen der Schriftart im Browser "mitzoomt". Soweit klappt das auch alles.

Nun habe ich allerdings eine kleine Animation mit JS erstellt (ausklappbares Menü).
Grob gesagt läuft das so ab, dass ich auf einen Div mehrmal hintereinander folgenden Befehl ausführe:

obj.style.height = obj.offsetHeight + 30 + 'px';

Dieser Befehl steht in einer Funktion und wird mittels window.setTimeout() einige Male ausgeführt, damit das Menü langsam ausfährt.
Das Div (hier durch "obj" repräsentiert) wird mittels CSS und der Angabe z.B. 4em definiert.

Das Problem ist nun, dass offsetHeight den Wert in Px zurückliefert und somit nach dem ersten Ausfahren des Menüs dieses nicht mehr an die Einstellungen der Browserschriftgröße angepasst wird.
Es ist ja dann in Px und nicht mehr in em eingestellt.

Also, habe ich da einen grundsätzlichen Denkfehler drin, oder kann ich Px irgendwie in em umrechnen (ich bräuchte ja dazu die aktuelle Einstellung des Browsers).

Vielen, vielen Dank im Voraus

Schöne Grüße
Axel