[學習]網(wǎng)頁設計與制作第14章firworks進階應用

1、第14章 Firworks進階應用,學習目標： 本章將介紹Fireworks MX 2004與Web相結(jié)合的圖像處理和加工能力，主要包括按鈕、蒙板、熱點等較高級的操作，最后還將介紹如何制作GIF動畫。通過本章的學習，要求掌握制作按鈕和彈出菜單的方法，學會使用切片和熱點工具，能夠制作GIF動畫。,第14章 Firworks進階應用,14.1 元件和實例的概念14.2 切片工具的使用14.3 創(chuàng)建熱點和

2、圖像映射14.4 制作按鈕14.5 制作彈出菜單,14.1 元件和實例的概念,元件是存儲在Fireworks庫中的一個特殊對象或?qū)ο蠼M，在圖像處理過程中，對于某些需要反復使用的相同元素，我們把它轉(zhuǎn)換成元件以后使用起來非常方便。Fireworks MX 2004提供了三種類型的元件：圖形、按鈕和動畫。實例是元件的副本，我們從庫中將元件拖動到文檔中，實際上就是在文檔中創(chuàng)建了該元件的一個實例。它具有該元件所具有的一切屬性，當我們編輯

3、這個元件時，該元件的所有的實例都會自動更新，這將大大減小我們的工作量。,14.1 元件和實例的概念,1.創(chuàng)建新元件2.轉(zhuǎn)換對象為元件3.編輯元件,14.2切片工具的使用,切片將Fireworks文檔分割成多個較小的部分，每個部分都以單獨的文件形式導出。切片的使用可以較好地優(yōu)化文件，其優(yōu)點主要表現(xiàn)在以下幾個方面：用戶可以分別對切割成的每一幅小圖片進行不同程度或不同格式的優(yōu)化。保證圖像質(zhì)量的同時不影響網(wǎng)頁的瀏覽速度。因為切片的使用

4、，可以使我們只修改網(wǎng)頁中一部分，而不用對整個網(wǎng)頁進行修改。,14.2切片工具的使用,1.切片工具2.設置切片對象的屬性3.導出所選切片4.導出切片文檔,14.3 創(chuàng)建熱點和圖像映射,有時候我們需要建立一個鏈接，但是又不希望以按鈕的形式進行交互，則可以通過創(chuàng)建熱點來達到這一目的。在很多網(wǎng)站上，我們也應用過用鼠標單擊圖片的不同部分可以鏈接到不同的網(wǎng)頁上去。這種提供多個超級鏈接的圖片稱為圖像映射。在Fireworks中創(chuàng)建熱點的方法很容

5、易：,14.3 創(chuàng)建熱點和圖像映射,熱點和切片的異同：兩者都可以定義鏈接和行為，都可以接受用戶事件產(chǎn)生響應。不同的是，熱點只是在圖像上指定了一個區(qū)域，而切片可以將圖像分割開。,14.4 制作按鈕,在Fireworks MX 2004中，我們可以輕松地創(chuàng)建出具有交互行為的精美按鈕 :1.新建按鈕元件2.將已有圖形或文本轉(zhuǎn)換成按鈕3.制作導航條,14.5 制作彈出菜單,注意：彈出菜單在Fireworks中預覽是看不到彈出菜單的，只

6、有按下F12鍵，打開IE瀏覽器進行預覽，才可以看到彈出菜單的效果。,14.6 制作蒙板,蒙板能夠隱藏或顯示對象或圖像的某些部分，也能將一個圖像混合到另一個圖像中去。蒙板并不直接應用于圖像，而是使蒙板對象位于被遮蓋的圖像之上。Fireworks提供了矢量蒙板和位圖蒙板兩種方法。,14.6 制作蒙板,1.創(chuàng)建矢量蒙板2.使用位圖蒙板3.文字蒙板,14.6 制作蒙板,用文字作為蒙板，可以得到和本書第12章的12.4節(jié)中介紹使用圖像填

7、充文本相同的效果。制作文字蒙板的方法和創(chuàng)建矢量蒙板的方法完全相同，只要將文字作為蒙板對象放置在背景圖片的上方即可。如圖14-21所示，為文字蒙板的效果。,14.7 創(chuàng)作動畫,在Fireworks MX 2004中，利用幀來創(chuàng)建GIF動畫，每一個幀上包含了不同的圖像，依次顯示不同幀上的圖像，形成運動的錯覺。在制作動畫之前，我們先認識一下用于動畫制作的動畫設置對話框，如圖14-22所示。,14.7 創(chuàng)作動畫,幀，調(diào)節(jié)動畫中的幀數(shù)。移動，調(diào)