1.CSS靜態濾鏡樣式 (filter)(只有IE4.0以上支持)
CSS靜態濾鏡樣式的使用方法:{ filter : filtername( parameters1, parameters2, …) }
Filter樣式 簡要說明 支持參數
alpha 設置圖片或文字的不透明度 opacity、finishOpacity、style、startX、startY、finishX、finishY、add、direction、strength
blur 在指定的方向和位置上產生動感模糊效果 add、direction、strength
chroma 對所選擇的顏色進行透明處理 color
dropShadow 在指定的方向和位置上產生陰影 color、offX、offY、positive
flipH 沿水平方向翻轉對象
flipV 沿垂直方向翻轉對象
glow 在對象周圍上發光 color、strength
gray 將對象以灰度處理
invert 逆轉對象顏色
light 對對象進行模擬光照
mask 對對象生成掩膜 color
shadow 沿對象邊緣產生陰影 color、direction
wave 在垂直方向產生正弦波形 add、freq、lightStrength、phase、strength
xray 改變對象顏色深度,并繪制黑白圖象
以上就是靜態濾鏡的全部內容,要注意的是CSS是區分大小寫的!
2.CSS動態濾鏡
動態濾鏡可以為頁面添加動人的淡入淡出、圖象轉化效果,它可以分為兩種blend(混合)和reveal(顯示),前者可以使對象漸漸消失或出現,后者提供了24種圖象轉化的效果。對于動態濾鏡的調用除去象在靜態濾鏡中要定義的濾鏡類型,參數等等,還用到腳本語言控制它的狀態。
首先,在開始一個動態效果之前,先需要進行裝備(Apply),然后播放(Play)動態效果,在動態效果進行中還可以中斷動態效果(Stop),以上可以用下面的方法實現:
對象名.filters(濾鏡數值).Apply()
對象名.filters(濾鏡數值).Play()
對象名.filters(濾鏡數值).Stop()
對于濾鏡狀態的判斷可以通過“對象名.filters(濾鏡數值).status”判斷,該值為0時,表示濾鏡未執行,為1時,表示濾鏡已經完成,為2時表示濾鏡在執行中。
在定義filter時,如上面所提到的,可以有混合(“filter:blendTrans(duration=時間數值)”,duration表示濾鏡執行需要的時間,單位為秒)和顯示(“filter:revealTrans(duration=時間數值,transition=過渡類型)”,過渡類型為從0-23的數值)兩種。
濾鏡目前還未被W3C正式承認。濾鏡只是微軟IE瀏覽器的組成部分,不能用于Netscape瀏覽器。制定有關標準的組織正在就此進行討論,但尚未達成最后定論。在我看來,濾鏡是一種非常有趣而且是制作精彩的視覺效果必不可少的一部分。濾鏡能節省帶寬,而且是你能在制作奇妙的
視覺設計時使用文字格式,而不必先制作龐大的文字位圖以取得相同的效果。
新聞熱點
疑難解答