JavaScript CSS-Colorchanger

[ChrisB]

Hi,

• kann man per JS erfahren, welche CSS-Eigenschaften auf welchem Wege einem Element zugeordnet wurden?

Du kannst die Stylesheets eines Dokuments auslesen, und ihre Regeln analysieren - das ist aber browserübergreifend etwas knifflig, siehe http://www.quirksmode.org/dom/changess.html. (Vielleicht bietet da irgendeines der Frameworks aber auch schon was fertiges.)

Inline-Styles sollten sich über Abfrage des style-Attributes (getAttribute) erfragen lassen.

• mit welchem JS-Framework lässt sich einfach ein eigener Colorchooser einbinden, sodass ich nicht auf JS-Color angewiesen bin?

Mit so gut wie jedem, würde ich vermuten.

• welches Framework bietet die mächtigsten Element-Selekt-Methode an? JQuerys $-Funktion?

Die dürften alle in etwas gleich mächtig sein - „mächtiger“ wirst du kaum brauchen.

• manchmal möchte man bestimmte Farbwerte gruppieren, also z. B. möchte man, dass die Hintergrundfarbe des Footers stets der Farbe von Überschriften und den Rahmen von Bildern entspricht. Deshalb habe ich daran gedacht, eventuell mit CSS-Datei-Templates zu arbeiten, in dem dann an den genannten 3 Stellen jeweils der selbe Platzhalter stehen könnte. Ein Skript könnte dieses dann beim Laden mit den hinterlegten Werten rendern.. Idee?

Ansätze für „Variablen“ in CSS gibt es bereits einige. Die erfinden meistens eigene Erweiterungen, die dann ein Parser vor der Auslieferung an den Browser in „normales“ CSS übersetzt.

• geschickt wäre natürlich, wenn ich das ganze auf margins, paddings etc erweitern könnte, sodass ich quasi die CSS-Dateien on-the-fly mit direkter Ergebnisvorschau ändern kann

Dazu gibt's auch schon diverse Ansätze, bspw. Online-Tools, wo du die Änderungen „live“ umgesetzt sehen kannst.

• kann ich mit Javascript nur element.style.borderColor verwenden oder gibt es auch eine Möglichkeit direkt mit element.style quasi den Style wie im CSS zu definieren?

Siehe wieder obigen Link - du kannst Stylesheet-Rules dynamisch erzeugen, und dabei einen kompletten String mit mehreren Eigenschaften-Definitionen zuweisen.

• kann ich per JavaScript das neuanwenden eines Stylesheets erzingen, ohne dass die Seite neugeladen wird?

Änderungen an den Stylesheets über die beschriebene Methode wirken sich direkt aus.

Bin euch für jede Idee oder Anregung dankbar

Allzu viel selber informiert hast du dich aber nicht vorher, oder?

MfG ChrisB