輪迴? webkit系的濾鏡

偉大的IE5.5團隊創造性地為瀏覽器帶來N多東西，把網影打得落花流水的同時，也讓微軟可以有肆無恐地十年不更新IE6了。它留下的瑰寶之一CSS濾鏡，也因為自身的原因與CSS3的崛起，處境尷尬。然而即便如此，我們也少不了它，如alpha濾鏡，實現透明效果，AlphaImageLoader濾鏡讓IE支援png透明，blur濾鏡類比CSS3盒陰影，更NB的是其矩陣濾鏡，完全可以用來實現CSS3 transform 2D!其實CSS3的許多效果何嘗不是對IE濾鏡的再實現？！這方面以chrome抄襲得最猖獗。

最近冒出來的-webkit-filter就是對IE濾鏡的敬禮。雖然口頭上說是從SVG上演變過來的，但SVG的濾鏡都是要用複數個標籤與N個屬性定義才能完成一個效果，因此這麼複雜的寫法是它流行不開的原罪。因此這次的再造輪子是衝著IE濾鏡而來。

如大多數IE濾鏡一樣，-webkit-filter是用來處理圖片的。以下效果要Chrome 18.0.97+支援。

原圖

模糊

50%灰階

100%灰階

50%褐色

100%褐色

50%亮度

100%亮度

色相

反色

飽和度

對比

相信這些效果在瀏覽器支援Capture API後，作用更大。文終時，突然想起《百年孤獨》，在故事的結尾時，家族的最後一個守護者奧雷良諾閱讀了記載這個百年世家的命運的羊皮卷後說：“這裡面所有的一切，我都曾經看到過，也早已知道！”哈哈，這世界就是條銜尾蛇！