複製鏈接
請複製以下鏈接發送給好友

RevealTrans

鎖定
CSS的RevealTrans動態濾鏡是一個神奇的濾鏡,它能產生23種動態效果,更為奇妙的是它還能在23種動態效果中隨機抽用其中的一種。
中文名
動態濾鏡
外文名
RevealTrans
性    質
濾鏡
產    生
23種動態效果
兩個參數Transition和Duration,分別是變換效果和持續時間,其中Duration是浮點數。
此外還有兩個屬性Enabled和Percent分別是是否激活濾鏡和當前靜態濾鏡輸出在轉換進程中所處的點。
設置完後還需要運行apply和play方法,分別是應用變換效果和運行效果
下面列出所有效果和對應Transition值(參考手冊):
值 : 效果
0 : 矩形收縮轉換。
1 : 矩形擴張轉換。
2 : 圓形收縮轉換。
3 : 圓形擴張轉換。
4 : 向上擦除。
5 : 向下擦除。
6 : 向右擦除。
7 : 向左擦除。
8 : 縱向百葉窗轉換。
9 : 橫向百葉窗轉換。
10 : 國際象棋棋盤橫向轉換。
11 : 國際象棋棋盤縱向轉換。
12 : 隨機雜點干擾轉換。
13 : 左右關門效果轉換。
14 : 左右開門效果轉換。
15 : 上下關門效果轉換。
16 : 上下開門效果轉換。
17 : 從右上角到左下角的鋸齒邊覆蓋效果轉換。
18 : 從右下角到左上角的鋸齒邊覆蓋效果轉換。
19 : 從左上角到右下角的鋸齒邊覆蓋效果轉換。
20 : 從左下角到右上角的鋸齒邊覆蓋效果轉換。
21 : 隨機橫線條轉換。
22 : 隨機豎線條轉換。
23 : 隨機使用上面可能的值轉換。
其中23比較特別,是隨機效果,程序默認就是隨機效果。
RevealTrans使用方法:style="FILTER: revealTrans(duration=2,transition=6)" 但是這個方法只對Ie有用,對firefox不起作用,我們可以在javascript裏面這樣設置用以過濾掉firefox:
if(navigator.appName == "Microsoft Internet Explorer"){image.filters.revealTrans.Transition=23;image.filters.revealTrans.duration=10;}
這樣,firefox依舊能正常執行以下語句。
或者,在火狐下添加IE tab plus插件 轉化!
下面是放在網頁的頭部:
<meta http-equiv="page-enter" content="revealtrans(duration=3,transition=23)">
<meta http-equiv="page-exit" content="revealtrans(duration=3,transition=23)">
意思是當你進入或離開時,會發生第23種(第23種特效是隨機)特效,特效時間持續3秒。
具體使用時要注意:
當你在網頁中動態改變圖片的連接地址時,請在地址改變前使用此濾鏡。
這樣,在頁面的現實效果是,前一個圖片會殘留濾鏡的作用時間,就像是新圖片一點一點替換原圖片一樣。