Hallo Leute,
Bei einem Projekt von uns, sollen aus beliebigen Bildern (JPEG) automatisch "runde" Vorschaubilder erstellt werden. Diese werden über einem mehrfarbigen Hintergrund gelegt (CSS Layer). Der Außenbereich der Kreise muss transparent sein.
Demo unter: http://www.hamann-media.de/mask/
Das ganze funktioniert aktuell folgendermaßen. Ich habe eine Maske, wo der runde Bereich (Kreis) als Transparent definiert wurde (PNG). Ich erzeuge also eine neue temporäre Grafik in den Maßen der Maske, kopiere das Ursprungsbild passend skaliert hinein und lege die Maske mit der Transparenz darüber. Danach definiere ich den äußeren Bereich wieder als Transparent.
Das Problem sind die scharfen Kanten die Zwangsläufig entstehen. Das Ergebnis sieht aus wie ausgeprickelt. Eine Idee war einen weiteren Innenkreis mit einer Breite von 1px und einer Transparenz von 50% zu definieren, der den Treppeneffekt abschwächen würde.
Habt ihr evtl. weitere Ideen? Bei dem Innenkreis weiß ich nicht wie ich diese zweite Transparenz von bsw. 50% über GD hinbekomme... any ideas?
Viele Grüße,
Stefan
Bei einem Projekt von uns, sollen aus beliebigen Bildern (JPEG) automatisch "runde" Vorschaubilder erstellt werden. Diese werden über einem mehrfarbigen Hintergrund gelegt (CSS Layer). Der Außenbereich der Kreise muss transparent sein.
Demo unter: http://www.hamann-media.de/mask/
Das ganze funktioniert aktuell folgendermaßen. Ich habe eine Maske, wo der runde Bereich (Kreis) als Transparent definiert wurde (PNG). Ich erzeuge also eine neue temporäre Grafik in den Maßen der Maske, kopiere das Ursprungsbild passend skaliert hinein und lege die Maske mit der Transparenz darüber. Danach definiere ich den äußeren Bereich wieder als Transparent.
Das Problem sind die scharfen Kanten die Zwangsläufig entstehen. Das Ergebnis sieht aus wie ausgeprickelt. Eine Idee war einen weiteren Innenkreis mit einer Breite von 1px und einer Transparenz von 50% zu definieren, der den Treppeneffekt abschwächen würde.
Habt ihr evtl. weitere Ideen? Bei dem Innenkreis weiß ich nicht wie ich diese zweite Transparenz von bsw. 50% über GD hinbekomme... any ideas?
Viele Grüße,
Stefan
Kommentar