28 Apr 2008

PNGs als alpha mask

Seit Internet Explorer ab Version 7 PNG-Dateien vollständig unterstützt macht Transparenz im Web endlich Spaß. Diese Demo zeigt eine Möglichkeit, wie man PNG-Dateien mit Transparenz als Maske verwenden kann, ähnlich wie Masken in Photoshop.

Dazu wird der eigentliche Gegenstand des Bildes transparent gemacht und auf einen farbigen Hintergrund gelegt. Zum Beispiel kann man so die Farbe eines Logos (oder eines anderen Gegenstandes, Beispiel iPod shuffle Seite) einfach per CSS ändern, statt jedes mal eine neue Bilddatei hochzuladen.

Alpha Mask PNG Demo

In Webdesign.

Kommentar schreiben