Element ohne sichtbare Auswirkungen auf die Darstellung

[Fabulit]

Hallo liebe Forumsgemeinde,

ich füge per Javascript ein span-Element in mein Dokument ein und möchte sicherstellen, dass auf dieses Element keine bestehenden CSS-Regeln angewendet werden, bzw. dass alle Eigenschaften auf ein von mir definierten "Null-Zustand" gesetzt werden. Das span-Element soll keine optische Änderung der Darstellung verursachen. Semantik ade, aber mir ist noch nichts gescheiteres eingefallen.

Zur Erläuterung: zu Übungszwecken erstelle ich grad ein unobtrusive JavaScript, welches Fieldsets auf- und zurollen soll. Mein ursprünglicher Ansatz; ich setzte beim Fieldset overflow: hidden und verändere anschließend die Größe des Fieldsets. Leider klappt das beim FF mit dem overflow: hidden nicht wie von mir gewünscht, da sich nur das Fieldset verkleinert, die Kind-Elemente aber noch dargestellt werden. Daher parke ich momentan die Kind-Elemente des Fieldsets zuerst in einem Span und dann wird das Span verkleinert.

Daher nun meine Fragen. Wie gehe ich mein Problem richtig an? Gibt es vielleicht doch die Möglichkeit ein FF-Fieldset zu bändigen?

Und auf jeden Fall interessehalber; wie stelle ich sicher, dass ein Element nicht von irgendwo her unbeabsichtigt Eigenschaften erbt? Alle möglichen Eigenschaften überschreiben?

Gruß Fabulit

[ChrisB]

Hi,

wie stelle ich sicher, dass ein Element nicht von irgendwo her unbeabsichtigt Eigenschaften erbt? Alle möglichen Eigenschaften überschreiben?

Ja.

MfG ChrisB

[Felix Riesterer]

Lieber Fabulit,

Und auf jeden Fall interessehalber; wie stelle ich sicher, dass ein Element nicht von irgendwo her unbeabsichtigt Eigenschaften erbt? Alle möglichen Eigenschaften überschreiben?

da Du mit JavaScript hantierst, kannst Du sämtliche style-Eigenschaften mit JavaScript befüllen, wie Du willst. Dann brauchst Du Dich um vererbte Eigenschaften nicht mehr zu kümmern.

Liebe Grüße,

Felix Riesterer.

[Fabulit]

Guten Morgen,

meine letzten Forschungen haben ergeben, dass das Style-Objekt gefühlte 8 Millionen verschiedene Eigenschaften und Methoden besitzt, welche von Browser zu Browser teils stark variieren. Erschwerend kommt hinzu, dass wirksame Änderungen nur mit gültigen Angaben möglich sind; ich kann ein margin nicht durch die Angabe von "none" aufheben.

Daraus ergibt sich für mich, dass ich eine Liste aller Eigenschaften und der gewünschten Werte vorhalten müsste. Oder übersehe ich etwas Entscheidendes?

Sollte eine umfassende Liste erforderlich sein, greife ich wohl besser auf ein solides Framework zurück (wie bei der domready/contentloaded-Problematik). Habt ihr da einen Tipp für mich? Ich habe mir bisher kein Framework genauer angeschaut.

Gruß Fabulit

[Der Martin]

Hallo,

meine letzten Forschungen haben ergeben, dass das Style-Objekt gefühlte 8 Millionen verschiedene Eigenschaften und Methoden besitzt, welche von Browser zu Browser teils stark variieren.

der Eindruck täuscht. Klar, die Zahl der Eigenschaften des style-Objekts ist riesig - sie entspricht der Zahl der CSS-Eigenschaften. Methoden definiert dieses Objekt aber keine.

Falsch ist auch, dass diese Eigenschaften von Browser zu Browser stark variieren - theoretisch sind sie mal für alle Browser gleich. Ob und wie ein Browser auf eine bestimmte style-Eigenschaft reagiert, ist aber eine andere Frage - aber die Antwort ist identisch mit der Antwort auf die Frage, welche CSS-Eigenschaften ein Browser wie unterstützt.

Erschwerend kommt hinzu, dass wirksame Änderungen nur mit gültigen Angaben möglich sind; ich kann ein margin nicht durch die Angabe von "none" aufheben.

Das ist überall in der EDV so - nur mit gültigen Angaben ist ein erwünschtes Ergebnis zu erreichen.

Daraus ergibt sich für mich, dass ich eine Liste aller Eigenschaften und der gewünschten Werte vorhalten müsste.

Wozu? Was willst du damit erreichen? Das ist mir nicht klar.

So long,
 Martin

[Fabulit]

Hi Martin,

ich habe das Style-Objekt per Schleife durchlaufen lassen und dabei begegnen mir die Eigenschaften wie, "getPropertyValue", "textKashida" oder "parentRule", die ich nicht aus dem CSS-Kontext kenne.

Abweichungen zwischen Browsern ergeben sich zum Beispiel aus proprietären Eigenschaften wie -moz-border-radius, oder msBlockProgression. Und Chrome z. B. gibt nur die Eigenschaften aus, die zuvor explizit (nicht nur übers Stylesheet) gesetzt wurden. Dafür bietet Chrome als Kompromiss eine Eigenschaft "length" für das Style-Objekt an, die mir im IE nicht zur Verfügung steht.

Das in der EDV grundsätzlich gültige Angaben gemacht werden müssen, ist mir auch klar; allerdings gibt es auch Systeme, die bei der Eingabe NULL oder ungültigen Werten einen vorgesehenen Standardwert setzen - eine solche Ambivalenz wollte ich mir zu nutze machen.

Mein Ziel: ein Span in ein (mir unbekanntes) Dokument einzufügen, ohne das dieses Element CSS-Eigenschaften aus Stylesheets erbt. Daher muss ich auf alle Eventualitäten, also alle möglicherweise vorkommenden Eigenschaften, vorbereitet sein. Daher meine Idee einer Liste aller Eigenschaften - dann prüfen, ob die Eigenschaft im aktuellen Kontext zur Verfügung steht und anschließend mit dem von mir gewünschten Wert überschreiben.

Gruß Fabulit