niedziela, 25 sierpnia 2013

Szybka strona w wersji żałobnej

Musiałem ostatnio szybko włączyć stronę żałobną na pewnej stronie. Jako, że z kolorem czcionek nie było problemu, z obrazkami było o wiele gorzej.
Jasne mogłem zmieniać każdy z nich ręcznie na czarno biały ale przy stronie z tak dużą ilością obrazków było to żmudne... Szczególnie, że obrazki są często aktualizowane.

I co tu począć, szukałem w sieci informacji na ten temat. Może jakiś java script, może coś innego...
Jak się okazało nie było nic prostszego...  Wystarczył css.

img.grayscale {
filter: url("data:image/svg+xml;utf8,#grayscale"); /* Firefox 10+, Firefox on Android */
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}

Kod znalazłem na blogu Karl-a Horky, web developera z Austrii. Kod Kod działa bez problemu, a i jego implementacja nie przynosi kłopotów.

Polecam!

Brak komentarzy: