[Erledigt] Barriereproblem mit Javascript - Seite 3

nikosch · 15.07.2010, 17:33

Ist halt ne Frage, wie der Browser das interpretiert - entweder multipliziert er die gegebenen Transparenzen oder er wertet jede Angabe als absolut zu 100% Normalansicht.

ChrisB · 15.07.2010, 17:55

Ersteres.

nikosch · 15.07.2010, 18:08

Alle?

nikosch · 15.07.2010, 18:16

Firefox kann die Vererbung bei mir nicht bestätigen:

Code:

<style>

.d1
  {
  background-color:#000000;
  color:#fff;
  filter:alpha(opacity=50);
  -moz-opacity:0.50;
  opacity:0.50;
  font-size:120%;
  }

</style>

<div class="d1">
  Test
  <div class="d2">
    Test
    <div class="d3">
      Test
    </div>
  </div>
</div>

Die inneren sind teiltransparent, weil das oberste teiltransparent ist. Sie sind jedoch nicht transparenter, als das Äußere. Die weiße Farbe des Textes ist dagegen geerbt.
Zum Vergleich mal das testen:

Code:

<style>

.div
  {
  background-color:#000000;
  color:#fff;
  filter:alpha(opacity=50);
  -moz-opacity:0.50;
  opacity:0.50;
  font-size:120%;
  }

</style>

<div class="d1">
  Test
  <div class="d2">
    Test
    <div class="d3">
      Test
    </div>
  </div>
</div>

Übrigens musste ich gerade einsehen (lesen), dass Transparenz hier der falsche Begriff ist. Es handelt sich natürlich um die Deckkraft.

ChrisB · 15.07.2010, 18:16

Wenn sie es nicht grundfalsch machen - ja.

ChrisB · 15.07.2010, 18:21

Zitat:

Zitat von nikosch

Firefox kann die Vererbung bei mir nicht bestätigen:

Welche Vererbung denn?
Das scheint mir mit eines der größten Missverständnisse bzgl. CSS zu sein - dass Leute oftmals denken, da müsse immer „Vererbung“ stattfinden.

CSS Color Module Level 3: Opacity:

Zitat:

Inherited: no

Zitat:

Die inneren sind teiltransparent, weil das oberste teiltransparent ist. Sie sind jedoch nicht transparenter, als das Äußere.

Da haben sie ja auch keinen Grund zu.

Zitat:

Zum Vergleich mal das testen:

Kein Element mit der Klasse "div" vorhanden - nichts zu testen

nikosch · 15.07.2010, 18:22

Jaja ..

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
timing Probleme bzw Zusammenspiel PHP Javascript	thica	PHP Tipps 2009	2	19.02.2010 19:06
[Erledigt] Ersatz für Javascript	Mort1ferus	JavaScript, Ajax und mehr	6	12.10.2009 09:35
Wie lade ich ein Javascript nach einer AJAX Abfrage neu?	da.eXecutoR	JavaScript, Ajax und mehr	3	21.09.2009 11:15
[Erledigt] Ist das ok, wenn eine Webseite nur in PHP ist und komplett auf JavaScript	coffeyn	Off-Topic Diskussionen	15	21.08.2009 15:11
[Erledigt] JavaScript Weiche bei Formular?	markus228	JavaScript, Ajax und mehr	1	09.08.2009 14:16
[Erledigt] Variable von Javascript mit 1x1px-Bild an PHP übergeben	beneblack	PHP Tipps 2009	18	03.05.2009 22:40
JS: Einführung - Javascript im Schichtenmodell	nikosch	Tutorials	4	11.04.2009 17:06
[Erledigt] Javascript in PHP Aufrufen	coyboc	PHP Tipps 2009	17	10.04.2009 15:28
1101: 10x JavaScript und kein Ende ist abzusehen…	Nikolaus 2.0	Adventskalender 2008	9	13.12.2008 20:11
PHP + Javascript + MYSQL	socke	PHP Tipps 2006	4	02.04.2006 22:02
Variable wird geändert bei Übergabe an Javascript		PHP Tipps 2007	4	17.12.2005 16:53
JavaScript in JavaScript geschriebene Html-Datei einbinden.	woods	HTML, Usability und Barrierefreiheit	6	06.09.2004 18:33
Javascript		HTML, Usability und Barrierefreiheit	5	31.08.2004 18:30
php + Javascript, Variablenübergabe		PHP Tipps 2004	14	28.07.2004 15:42

15.07.2010, 17:33
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Ist halt ne Frage, wie der Browser das interpretiert - entweder multipliziert er die gegebenen Transparenzen oder er wertet jede Angabe als absolut zu 100% Normalansicht. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

15.07.2010, 17:55
ChrisB Moderator¹ Registriert seit: 28.03.2010 Beiträge: 7.470 PHP-Kenntnisse: Fortgeschritten	Ersteres. __________________ RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?

15.07.2010, 18:08
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Alle? __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

15.07.2010, 18:16
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Firefox kann die Vererbung bei mir nicht bestätigen: Code: <style> .d1 { background-color:#000000; color:#fff; filter:alpha(opacity=50); -moz-opacity:0.50; opacity:0.50; font-size:120%; } </style> <div class="d1"> Test <div class="d2"> Test <div class="d3"> Test </div> </div> </div> Die inneren sind teiltransparent, weil das oberste teiltransparent ist. Sie sind jedoch nicht transparenter, als das Äußere. Die weiße Farbe des Textes ist dagegen geerbt. Zum Vergleich mal das testen: Code: <style> .div { background-color:#000000; color:#fff; filter:alpha(opacity=50); -moz-opacity:0.50; opacity:0.50; font-size:120%; } </style> <div class="d1"> Test <div class="d2"> Test <div class="d3"> Test </div> </div> </div> Übrigens musste ich gerade einsehen (lesen), dass Transparenz hier der falsche Begriff ist. Es handelt sich natürlich um die Deckkraft. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

15.07.2010, 18:22
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 35.987 PHP-Kenntnisse: Fortgeschritten	Jaja .. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --