Strona docelowa efektów filtra CSS w WebKit

Wprowadzenie

Efekty filtrów są dostępne już od jakiegoś czasu, ale zostały zaprojektowane tak, aby działały w SVG. Potrafią one z dużą skutecznością stosować efekty takie jak intensywność kolorów, zniekształcenia i rozmycie na obrazie, zanim zostanie on skomponowany i zrenderowany w dokumencie.

W 2009 roku firma Mozilla powiedziała, że SVG to za mało. W końcu pójdzie o krok dalej i zezwoli na wyświetlanie treści HTML w przeglądarce Firefox 3.5. Zobacz ponadczasową demonstrację filtrów SVG stworzoną przez Paula Irlandii na urządzeniu <video>. Jak widać, działa tylko w Firefoksie, ale i tak staje się pszczółka.

Dziś

Flash na czas do końca 2011 roku, a firma Adobe i inne firmy ciężko pracowały nad wprowadzeniem tej niesamowitej technologii do CSS. Chodzi o CSS Filtr Effects 1.0, który został wdrożony przez WebKit.

Włączenie filtrów bezpośrednio w CSS pozwala wykorzystać je w niemal każdym elemencie DOM. Obrazy, <video>, <canvas>, podaj nazwę.

Wersja demonstracyjna efektów filtra CSS.

Przyszła

Specyfikacja definiuje też moduły do cieniowania CSS, które z czasem wdrożyą technologię cieniowania OpenGL do CSS. To BARDZO ekscytujące! Za każdym razem, gdy uruchamiasz układ GPU w systemie, pamiętaj o kwestiach związanych z bezpieczeństwem. Z tego powodu w WebKit są obecnie zaimplementowane tylko funkcje filtrowania CSS.

Pomoc

Chrome 18.0.976.0 (obecnie w wersji do wczesnych testów), Webkit co noc

W plikach nocnych Webkit filtry można stosować do treści z akceleracją sprzętową ( np. img { -webkit-transform: translateZ(0); }). W Chrome działanie filtrów dotyczących przyspieszonej treści jest wciąż wykonywane (użyj flagi --enable-accelerated-filters). Obejmuje to m.in. zdarzenie <video>, które jest domyślnie przyspieszane.