CSS mit JS manipulieren - Eigenschaften haben keine Werte

[RikuXan]

Hi liebe html.de-Forumsmember,
ich versuche gerade für einen Blog ein Skript zu schreiben, das die Sidebar ausblendet. Dazu muss ich die CSS Eigenschaften der Sidebar und des Textbereichs verändern.
Nun versuche ich zuerst die Breite auszulesen und sie dann schrittweise zu vermindern.
Allerdings wird mir, wenn ich versuche mit

alert( document.all["sidebar_right"].style.width );

die Breite auszugeben, nur ein leeres Dialogfenster. Ich weiß nicht, woran das liegt, wenn ich den Wert zuerst mit

document.all["sidebar_right"].style.width = "100px";

verändere und danach die Dialogbox aufrufe funktioniert alles.
Ich hoffe ihr könnt mir helfen, wenn ihr weitere Fragen habt, schreibt einfach.

Freundliche Grüße,
Philipp

 

[threadi]

document.all wird nicht von jedem Browser komplett unterstützt. Arbeite lieber mit document.getElementById, was eine eindeutigere Referenzierung auf ein Objekt darstellt.

 

[RikuXan]

Danke für den Hinweis, ist mir auch aufgefallen, als ich es für Firefox angepasst hab ( Chrome unterstützt es ). Habs geändert, aber das Problem besteht weiterhin - Die Eigenschaften haben keine auslesbaren Werte, bevor diese nicht verändert werden.
Noch jemand anders Ideen?

Philipp

 

[threadi]

Kann es sein, dass Du die CSS-Eigenschaften in einer externen CSS-Datei oder innerhalb von <style> stehen hast? Und nicht als Inline-Style? Wenn ja, dann liegt es daran, dass die Browser diese CSS-Eigenschaften dann nicht auslesen können. Du musst auf die ComputedStyles zurückgreifen. Siehe:
JavaScript: Zusammenarbeit mit CSS, Darstellung von Dokumenten steuern
JavaScript - Get Styles

 

[RikuXan]

Vielen Dank, genau das war der Fehler. Das ganze steht in Zusammenhang mit Wordpress und dort wird das Stylesheet ja aus einem externen File geladen. Vielen Dank für die Lösung :)

Freundliche Grüße,
Philipp