Wie kann man den Hintergrund in CSS langsam schwarz werden lassen?

Cloudstar002  17.01.2022, 18:34

Meinst du über zeit oder einfach nen Farbverlauf?

Lass228 
Beitragsersteller
 17.01.2022, 18:35

Im Verlauf des Bildes soll langsam ein eine Art "Schwarzfilter" einsetzen.

3 Antworten

Vom Beitragsersteller als hilfreich ausgezeichnet

Das geht soweit ich weiß nur mit JavaScript. Um nicht endlos JS lernen zu müssen gibt es jQuery. Das ist eine JavaScript-Datei, die man einfach nur auf seiner Seite einbinden muss. Damit sind coole Dinge möglich - sehr zu empfehlen.

So zum Beispiel auch das faden eines Hintergrunds. Diesen Code habe ich dazu gefunden:

$('#myElement').animate({backgroundColor: '#FF0000'}, 'slow');

Es braucht also über dem Bild noch ein transparentes div, das dann langsam schwarz wird.

Das hab ich auch noch gefunden, wie es auch gehen könnte (auch mit jQuery):

https://api.jqueryui.com/highlight-effect/

Ist der Filter Befehlt vllt. das, was du suchst? Oder backdrop-filter gab es meine ich auch noch


Lass228 
Beitragsersteller
 17.01.2022, 18:40

Ja, irgendwas, mit dem man so eine Ausschwärzung hinbekommen kann.

FaTech  17.01.2022, 18:41
@Lass228

Google mal filter oder backdrop-filter, falls das aber nicht ist, was du suchst, kannst du auch ein div darüber legen mit rgba schwarz wert bei Farbe und transparenz, wie du es brauchst

Ich weiß ehrlich gesagt nicht ob das funktioniert, weil ich das jetzt auch nicht testen will, aber ich würde es mit einer Keyframe-Animation versuchen.