這是一個(gè)幻燈片播放程序,也是一圖片輪流播放的程序。我們在一些站點(diǎn)上可以看見這種形式的廣告播放條,大多是用CGI做的,也是要服務(wù)器端支持CGI程序,如ASP、PHP、Perl等。但我們這里的實(shí)現(xiàn)方法無需CGI,用的僅是CSS的效果,再加上JavaScripts的控制。只要你的瀏覽器是IE 4.0以上或是Netscape 3.0以上的可以了。只不過在這里我們用到了CSS的Filter濾鏡效果,該效果只能在IE中出現(xiàn)。有關(guān)CSS的Filter濾鏡效果,大家可以參看我的《CSS中Filter濾鏡詳解》,該文章在Yesky.com上已經(jīng)發(fā)表。 好了,讓我們來做點(diǎn)準(zhǔn)備工作吧。 首先,為了制作這個(gè)效果,我們首先要打幾個(gè)尺寸一樣大小的圖片,讓其輪流播放。比如,我找了下面三個(gè)88x31的圖片做為所用的的圖片。 其次,讓我們再來復(fù)習(xí)一下CSS中Filter的圖片轉(zhuǎn)換濾鏡的知識(shí): CSS中的顯示轉(zhuǎn)換濾鏡 顯示轉(zhuǎn)換濾鏡提供的是一種更為多變的轉(zhuǎn)換效果,它不像混合轉(zhuǎn)換濾鏡,只提供一種淡入淡出的效果,它還提供了更多的圖片轉(zhuǎn)換效果,它的語法是:Filter : RevealTrans ( duration = 轉(zhuǎn)換的秒數(shù),transition=轉(zhuǎn)換類型 ) 大家可以看見,它有一個(gè)轉(zhuǎn)換類型的參數(shù),這里,它提供了24種轉(zhuǎn)換類型,我們只需指定轉(zhuǎn)換類型的代號(hào),可以讓圖片按特有的轉(zhuǎn)換效果進(jìn)行轉(zhuǎn)換。下表是24種轉(zhuǎn)換濾鏡的形式及其對應(yīng)的代號(hào):
顯示轉(zhuǎn)換濾鏡的轉(zhuǎn)換形式
所對應(yīng)的代號(hào)
顯示轉(zhuǎn)換濾鏡的轉(zhuǎn)換形式
所對應(yīng)的代號(hào)
矩形從大至小
0
隨機(jī)溶解
12
矩形從小至大
1
垂直向內(nèi)裂開
13
圓形從大至小
2
垂直向外裂開
14
圓形從小至大
3
水平向內(nèi)裂開
15
向上推開
4
水平向外裂開
16
向下推開
5
向左下剝開
17
向右推開
6
向左上剝開
18
向左推開
7
向右下剝開
19
垂直形百葉窗
8
向右上剝開
水平形百葉窗
9
隨機(jī)水平細(xì)紋
21
水平棋?/TD>
10
隨機(jī)垂直細(xì)紋
22
垂直棋盤
11
隨機(jī)選取一種
23