Dreamweaver網(wǎng)頁設計案例教程 沈大林 等 第6章 時間軸和行為

《Dreamweaver網(wǎng)頁設計案例教程 沈大林 等 第6章 時間軸和行為》由會員上傳分享，免費在線閱讀，更多相關(guān)內(nèi)容在教育資源-天天文庫。

1、第6章時間軸和行為6.1【案例33】“體育世界”網(wǎng)頁6.2【案例34】添加游動廣告的“體育世界”網(wǎng)頁6.3【案例35】“跟我學計算機”網(wǎng)頁—調(diào)出式菜單6.4【案例36】“北京名勝1”網(wǎng)頁—交替變化圖像6.5【案例37】“北京名勝2”網(wǎng)頁—彈出窗口6.6【案例38】“圖像鏈接翻轉(zhuǎn)”網(wǎng)頁6.7【案例39】“跟我學制作表單”網(wǎng)頁（二）6.8【案例40】“控制播放Flash動畫和MIDI音樂”網(wǎng)頁6.9【案例41】“活動菜單”網(wǎng)頁6.10【案例42】“拼圖”網(wǎng)頁6.1【案例33】“體育世界”網(wǎng)頁1．“時間軸”面板單擊“窗口”→“時間軸”菜單命令或按【Alt+F9】組合鍵，即可調(diào)出“時間軸

2、”面板，如圖6-1-4所示。該面板中的各個工具及其他選項的作用如下。（1）“時間軸”下拉列表框：其內(nèi)列出了當前頁面內(nèi)所有時間軸動畫的名字，選中其中一個選項后，相應的動畫就會在“時間軸”面板中顯示出來。右擊“時間軸”面板內(nèi)部，調(diào)出“時間軸”快捷菜單，單擊該菜單中的“添加時間軸”菜單命令，即可在“時間軸”下拉列表框內(nèi)添加一個新的時間軸動畫（默認名稱為“Timeline”+序號）。（2）回放頭：播放動畫時，它在時間標尺上移動，好像放像機的磁頭一樣。用鼠標拖曳它在時間標尺上移動，當它移到某一時間單位處時，相應的動畫畫面就會出現(xiàn)在網(wǎng)頁窗口內(nèi)。（3）【播放】按鈕：單擊它，可以使動畫前進一個幀

3、。按住該按鈕不放，可以向正常方向播放動畫。（4）【回放】按鈕：單擊它，可以使動畫回退一幀。單擊按下該按鈕不放，可以向相反方向播放動畫。（5）【歸位】按鈕：將動畫圖像移到起始位置，同時回放頭也移動到該位置處。（6）“回放頭位置”（也是當前幀號碼）文本框：用來輸入顯示和設置“回放頭”所處的時間軸位置號，即當前幀號碼。（7）“速率”文本框：用來輸入每秒鐘播放的幀數(shù)。（8）“自動播放”復選框：選中它后，則在網(wǎng)上下載后會自動播放。不選中它時，需要在使用行為事件時才可以播放。（9）“循環(huán)”復選框：選中它后，則循環(huán)播放動畫，否則只播放一次動畫。（10）動畫通道：它由許多圖層組成，表示可以在一個

4、頁面內(nèi)加入多個時間軸動畫，但最多可以加32個。它的左邊標有圖層的編號，圖層編號大的動畫在圖層編號小的動畫之上。（11）動畫條：表示一個動畫所占的幀數(shù)，上面標有該動畫所在層的名字。它的起始處和終止處各有一個小圓，表示首幀和終止幀。如果設置了關(guān)鍵幀，則關(guān)鍵幀也會有一個小圓。（12）行為通道左邊標有字母“B”，可以在該通道的特定幀使用行為。（13）行為幀：加入了行為的幀，它在“行為通道”內(nèi)。（14）時間標尺：給出了與時間對應的幀數(shù)碼。2．直線移動動畫的制作下面來使用“時間軸”面板制作一個簡單的、沿直線移動的動畫。該動畫的制作方法如下所述。（1）在頁面內(nèi)插入一個層，給該層起一個名字，例如

5、“Layer1”。然后在層內(nèi)插入一個圖像、動畫或輸入一些文字等。此處層中插入的是GIF動畫，如圖6-1-6所示。（2）將插有圖像或文字的層移到動畫的起始位置。（3）單擊“窗口”→“時間軸”菜單命令，調(diào)出“時間軸”面板。（4）用鼠標將層拖曳到“時間軸”面板的動畫通道內(nèi)，或單擊“修改”→“時間軸”→“增加對象到時間軸”菜單命令。這時，“時間軸”面板的動畫通道內(nèi)會出現(xiàn)一個動畫條。如果選中了“循環(huán)”復選框，則在動畫通道中，會同時出現(xiàn)一個“動作幀”。（5）單擊選中動畫條的終止幀。默認的動畫幀數(shù)是15幀，如果要調(diào)整動畫的幀數(shù)，可用鼠標拖曳動畫條終止幀的小圓。在改變了終止幀的位置之后，如果此時

6、選中了“循環(huán)”復選框，還應用鼠標拖曳行為通道的行為幀到終止幀的下一個位置處。用鼠標向右拖曳第15幀小圓到第30幀處，如圖所示。（6）用鼠標拖曳動畫層到目標處。當松開鼠標左鍵時，會看到一條直線，表示圖像移動的路徑。在選中“循環(huán)”復選框的情況下，如果先用鼠標拖曳動畫層到目標處，再調(diào)整“時間軸”面板中終止幀的位置，則還需要用鼠標拖曳調(diào)整“動作幀”到終止幀的下一幀位置處。（7）按住【播放】按鈕不放，即可在網(wǎng)頁設計窗口內(nèi)看到動畫。6.2【案例34】添加游動廣告的“體育世界”網(wǎng)頁“時間軸”面板可以在用戶給出起始幀和終止幀后自動產(chǎn)生中間過程的各幀。如果動畫的移動路徑不是直線的，中間有轉(zhuǎn)折點，則

7、轉(zhuǎn)折點處的畫面就是關(guān)鍵幀。加入關(guān)鍵幀，可以使沿直線路徑移動的動畫變?yōu)檠厍€或折線路徑移動的動畫，添加關(guān)鍵幀的方法如下。（1）單擊選中動畫條內(nèi)要加入關(guān)鍵幀的位置，回放頭會隨之移到此時間位置，同時回放頭回移到此處，用來指示選中的位置。例如，選擇第15幀（將終止幀移到第30幀處）。（2）在動畫條內(nèi)，單擊鼠標右鍵，調(diào)出時間軸快捷菜單。再單擊該菜單內(nèi)的“增加關(guān)鍵幀”菜單命令，即可在選中的位置處插入一個關(guān)鍵幀，如圖所示。按住【Ctrl】鍵，單擊要加入關(guān)鍵幀的位置，也可以添加關(guān)鍵幀。如果對關(guān)鍵