Wie programmiert man die HTML Transparenz richtig?

Computer: Software & Programmierung HTML & CSS
#1

Hallo,

Ich versuche zur Zeit auf meiner Seite dem User die Möglichkeit zu geben, dass er sein Profil individuell gestalten kann.
Dabei sollte er auch die Transparenz auswählen können. Nun ist es allerdings so, dass wenn ich es mit meinem Lösungsweg versuche, so greift die Transparenz auf alle „Kind“-HTML Elemente über. D.h., dass die Schrift und gewisse Symbole auch transparent werden, wobei doch eigentlich von meiner Idee her nur der Hintergrund transparent werden sollt.

Kennt sich jemand vllt. damit aus, der mit Tips geben könnt oder irgendwelche Tutorials empfehlen könnt?

Alex

#2

Hallo,

Dabei sollte er auch die Transparenz auswählen können. Nun ist
es allerdings so, dass wenn ich es mit meinem Lösungsweg
versuche, so greift die Transparenz auf alle „Kind“-HTML
Elemente über. D.h., dass die Schrift und gewisse Symbole auch
transparent werden, wobei doch eigentlich von meiner Idee her
nur der Hintergrund transparent werden sollt.

Moment mal.
Hinter dem Hintergrund kommt nichts mehr (nur noch der Default-Hintergrund des Browsers). Was bringt dir dann transparenter Hintergrund?

Und was ist eigentlich dein Lösungsweg?

Grüße,
Moritz

#3

Hi,

der „main“-Bereich ist zentriert, so, dass Rechts und Links eine Hintergrundfarbe oder ein Hintergrundbild ist (je nachdem was der User auswählt). Ich will ihm eben die Möglichkeit geben, dass er die Transparenz des main-Bereichs regulieren kann, so, dass evtl. das Hintergrundbild /-farbe durch das main durchscheint.
Hoffe, dass es einigermaßen verständlich ist :smile:

Nun ich habs so versucht, dass ich dem main eine Transparenz gegeben hab. Dies bewirkt aber allerdings, dass die „Unter“-Elemente auch alle transparent werden (Schrift…).

Gruß

Alex

1 Like
#4

Moin,

Nun ich habs so versucht, dass ich dem main eine Transparenz
gegeben hab. Dies bewirkt aber allerdings, dass die
„Unter“-Elemente auch alle transparent werden (Schrift…).

Und was passiert, wenn Du diesen Elementen dann die Transparenz wieder nimmst?

Aso für „#main *“ vermutlich?

Grüße,
-Efchen

#5

Hallo,

Nun ich habs so versucht, dass ich dem main eine Transparenz
gegeben hab. Dies bewirkt aber allerdings, dass die
„Unter“-Elemente auch alle transparent werden (Schrift…).

das nennt sich Vererbung und ist so gewollt :smile:
(Elterneigenschaften werden an die Kinder weitergegeben)
Die Eigenschaft des Elternelementes, das nicht vom Kindelement übernommen werden soll, muss daher für das Kindelement „separat“ definiert werden.

Gruß
Klaus

#6

Hi,
Also das ist mein Problem:
http://img594.imageshack.us/img594/8492/tansparenz.png

Ich kann ja die Transparenz nicht von den Kindelementen wegnehmen bzw. setzen. Wenn ich z.B.: bei „main“ die Transparenz auf 50% setze und bei Kindelementen auf 95%, so ist bei den Kindelementen die Transparenz auf 95% von 50% (also: 47,5%)
Verstehst wie ich es meine?

Alex

1 Like
#7

man kann die transparence nicht extra setzen, es wird immer auf alle kind elemente übertrage, warum das so ist, keine ahnung, warscheinlich eher ein organisierungs problem.

Wenn kannst du nur transparente hintergrundbilder nehmen , die sind dann aber nicht variabel, du müsstest also z.b. alle 10% stufen schon bereitstellen.

Ist nun einmal so :smile:

#8

Die Lösung mit den Transparenten Hintergründen schließt sich schon mal aus, da nicht ich die Hintergründe bereitstelle, sondern ein User selbst sein eigenes Hintergrundbild hochladen kann / soll.

Im Internet steht überall, dass man es mit der Anordnung der DIVs hinkriegen kann, wenn man eben das „Kind“ Element über das transparente Element legt. Ich habs schon mehrmals versucht, aber irgendwo mache ich einen Fehler, so, dass es dann wieder nicht geht.

1 Like
#9

Die Lösung mit den Transparenten Hintergründen schließt sich
schon mal aus, da nicht ich die Hintergründe bereitstelle,
sondern ein User selbst sein eigenes Hintergrundbild hochladen
kann / soll.

geht auch, düfen sie allerdings nur png uploaden, und die kannst du dann selber transparent machen , gehen tut das , auch alpha blending kann php gd image modul .

Im Internet steht überall, dass man es mit der Anordnung der

aha, und wo ? wieder so eine schlaumeierei , ohne Quellen angabe lol.
Aber mann kann es ja mal versuchen oder wie ??

DIVs hinkriegen kann, wenn man eben das „Kind“ Element über
das transparente Element legt. Ich habs schon mehrmals
versucht, aber irgendwo mache ich einen Fehler, so, dass es
dann wieder nicht geht.

dann hast du das falsch gelesen . Selbst wenn ich dem kind element opacity 1.0 gebe so ist das relative zu dem was das eltern element hatte , war das 0.5 ist es immernoch 50% und nicht 100% . Da opacity auch nur werte von 0-1 hat geht auch nicht 2.0 um mal eben von 50% auf 100% zu kommen.

http://abacvs.org/oldserver/helptheworld/html/opacit…

egal wie ich sie übereinanderlege oder z.indexe es bleibt wie es ist.

#10

der link war nur für FF

http://abacvs.org/oldserver/helptheworld/html/opacit…

#11

Hallo,

Nun ich habs so versucht, dass ich dem main eine Transparenz
gegeben hab. Dies bewirkt aber allerdings, dass die
„Unter“-Elemente auch alle transparent werden (Schrift…).

das nennt sich Vererbung und ist so gewollt :smile:
(Elterneigenschaften werden an die Kinder weitergegeben)
Die Eigenschaft des Elternelementes, das nicht vom Kindelement
übernommen werden soll, muss daher für das Kindelement
„separat“ definiert werden.

das ist generelle vererbung von werten:smile:

Bei transparency ist es aber ein special Fall . Es werden nicht die Werte vererbt sondern es wird eine basis geerbt.

Eltern opacity wert 0.5
kinder opacity wert 1.0 aber relative zu Eltern
also 1.0 * 0.5 = 0.5 = 50%

es wird also nicht der wert vererbt, eher wird dem ganzen layer quasi dieser alpha channel mitgegeben. Da kann man leider auch nicht

falsch ist :
Eltern opacity wert 0.5
kinder opacity wert 2.0
also 0.5 * 2.0 = 1.0 = 100%

Gruß
Klaus

#12

Also Rakon…
Bevor du mir unterstellst, dass ich hierher komme und irgendein „Mist“ rede, was meinem Problem nicht helfen würde, dann erkundige dich erstmal genauer.

Durch positionierung des Divs sollte man das angeblich erreichen können.
FÜR RAKON HIER DER LINK:
http://www.frische-zitronen.de/2010/04/10/transparen…
Punkt: Transparenz mit CSS3 opacity

Desweiteren ist es mir bewusst, dass Angaben der Kindelemente stets relativ zu den Angaben der Elternelemente sind. Die 100% stellen eben 1.0 dar.

1 Like
#13

Durch positionierung des Divs sollte man das angeblich
erreichen können.
FÜR RAKON HIER DER LINK:
http://www.frische-zitronen.de/2010/04/10/transparen…
Punkt: Transparenz mit CSS3 opacity

na klar geht das so … aber dann ist das ja auch kein kind mehr vom transparentem (eltern) div :smile:)

1 Like