ChrisB: Bild 1 „durchleuchten“ um Bild 2 zu sehen.

Beitrag lesen

Hi,

Wenn ich z.B. ein dritten Layer über beide Bilder lege und diesen mit opacity versehe, erhalte ich kein „Röntgen“-Effekt. Nur der Layer 3 an und für sich wird transparent. Nicht jedoch Bild 2.

Wie kann ich opacity stellenweise auf Bild 2 anwenden? Ohne das gleich das ganze Bild durchsichtig wird?

Direkt: Gar nicht.

Indirekt: Indem du ein kleines Element über dem oberen Bild platzierst, und diesem das untere Bild als (passend positioniertes) Hintergrundbild verpasst. Damit hättest du zunächst eine rechteckige Form – mittels border-radius solltest du die auch noch rund bekommen. Bewegung dieses „Ausschnittes“ dann per JavaScript realisieren.
Das ergäbe dann optisch erst mal einfach nur ein „Loch“ im oberen Bild, durch das man glatt hindurchschauen und das untere sehen kann. Wenn du dem Element jetzt noch opacity mitgibst, sollte sich auch ein Effekt erreichen lassen, der aussieht als ob in Wirklichkeit das obere Bild an der Stelle teiltransparent wäre.

Wenn du mehr willst – keine gleichförmige Transparenz, sondern einen Verlauf o.ä. – dann wirst du „schwerere Geschütze“ auffahren müssen, bspw. Flash oder Canvas.

MfG ChrisB

--
RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?