Alle Elemente außer einem verändern

[King-of-Manhattan]

Hi,
ich will an einem Projekt alle Elemente außer einem und dessen Unterelementen mit einem opacity-filter grau machen, und deakivieren.

Gibt es da eine komfortable Lösung?
Ich hoffe ihr wisst wie ich meine.

[korn]

Hi,
ich will an einem Projekt alle Elemente außer einem und dessen Unterelementen mit einem opacity-filter grau machen, und deakivieren.

Gibt es da eine komfortable Lösung?
Ich hoffe ihr wisst wie ich meine.

Ich denke ja.

* {
   opacity....
}

.element_das_nicht_transparent_sein_soll {
    opacity deaktiviert
}

Was zwischen den geschwungenen Klammern steht, wirst du schon hinbekommen ;-)

MfG

[ThomasM]

Hallo korn,

* {
   opacity....
}

Damit wird nicht jedem Element dieselbe Opazität zugewiesen, sondern nur denen auf oberster Ebene, den jeweils darunter liegenden wird die Deckkraft wiederum multiplikativ vererbt.

.element_das_nicht_transparent_sein_soll {
    opacity deaktiviert
}

Deaktivieren kann man die Deckkraft nicht, sie kann maximal den Wert 1.0 erhalten, was nur bedeuten würde, dass die Vererbung an dieser Stelle unterbleibt.

Mal ein Beispiel (unter der Annahme, dass html und body nicht mitspielen):

<div><p>Text<span>Text</span>Text</p></div>

mit

*  
{  
  opacity: 0.5;  
}

ergibt sich div -> 0.5 | p -> 0.25 | span -> 0.125, was sich veranschaulichen lässt ohne *-Regel, aber mit

span  
{  
  opacity: 0.125;  
}

Setzt man dagegen an:

*  
{  
  opacity: 0.5;  
}  
  
span  
{  
  opacity: 1.0;  
}

würde sich wiederum p -> 0.25 ergeben und span würde 0.25 * 1 = 0.25 beibehalten, also die Kette nur aufhalten, aber nicht zur vollen Deckkraft zurück finden.

Insofern würde hier wohl nur ein relativ aufwändiges Verfahren unter Nutzung von JavaScript helfen oder die Verwendung von CSS-Farbwerten, welche dann selektiv überschrieben werden können.

Grüße,
Thomas

[King-of-Manhatten]

Wäre es dann besser ein transparentes Bild über alles zu setzen und dann das Element über das Bild zu legen?

Vielen Danke für die Antworten!