Gunnar Bittersmann: Seite abdunkeln bei Klick in Input Feld

Beitrag lesen

@@Auge

Ja, das geht mit der CSS-Eigenschaft Transition.

Ein bisschen Gehirnschmalz muss man da aber schon reinstecken.

Umschalten der Sichtbarkeit mit display: none/block` fällt dann aus.

Auf opacity: 0/0.5 lässt sich transition anwenden. Aber das reicht nicht. Die Blende darf ja nicht unsichtbar über anderen Elementen liegen, sonst sind die nicht clickbar. Also auch sowas wie z-index: -1/0 schalten.

Auch auf z-index lässt sich transition anwenden. Nur muss man auf die Abfolge achten. Beim Ausblenden der Blende darf z-index erst am Ende der opacity-Transition umgeschaltet werden. So sieht’s aus.

Die Unterstützung durch die Browser ist weit mehr als ausreichend.

Alle relevanten außer – naturgegeben – Opera Mini.

Und selbst wenn transition nicht weitgehend unterstützt werden würde, wäre das auch egal. transition macht ja nichts kaputt, sondern bereichert (progressive enhancemant).

LLAP 🖖

--
Ist diese Antwort anstößig? Dann könnte sie nützlich sein.