建立按鈕（Buttons）和導航條（Navigation Bars)

按鈕|建立 建立按鈕（Buttons）和導航條（Navigation Bars）（下）


剛才我們建立了一個按鈕，接下來我們就可以利用這個按鈕方便的建立導航條了。在Fireworks中你可以利用同一個按鈕反覆衍生出一系列類似的按鈕來組成導航條，而無需重複建立多個類似的按鈕，大大減少了工作量，這就是Fireworks神奇的地方！！！現在我們就去看看是怎麼做的吧。

開啟Library面版，將Home按鈕拖到畫板中，重複這個動作幾次，使畫板中有多個Home按鈕，在這裡我一共放了4個相同的按鈕。


將這些按鈕擺放整齊後，選擇Window->object開啟object面版，選中一個按鈕可以在object面版中看到相關的參數，其中的Button Text就是每個按鈕的文字，我們只要修改object面版中的文字就可以改變畫板上按鈕的文字。在彈出的視窗中選擇Current，如果選擇All就改變畫板上所有按鈕的文字。注意一下Library面版，你每改變一次就會自動產生一個按鈕。


完成後Preview一下導航條的效果，圖中綠色是點擊（Down）後的按鈕狀態，白色是通常（Up）狀態，黃色是滑鼠懸浮（Over）的狀態。


如果滿意就可以把圖象輸出成HTML代碼了，選擇File->Export在彈出的視窗中設定輸出的格式。選擇Include Areas without Slices將把沒有切割的部分也輸出成相應大小的圖片，如果不選擇就會用一張1x1大小的透明gif圖片（spacer.gif）來撐開儲存格。選擇Put Images in Subfolder將圖片儲存在不同的目錄中。


點擊Option進入更為細緻的設定。
General：設定輸出的檔案的尾碼名，檔案名稱的大小寫，以及對應何種網頁編輯器。
Table：設定表格參數，建議使用預設，它會運用spacer.gif撐開空白的儲存格使得輸出結果在IE和Netscape中看起來一樣。
Document Specific：設定自動命名檔案的規則，值得一提的是這裡隱藏了一個相當重要的選項Multiple Nav Bar HTML Pages，這個選項決定了是輸出一個HTML檔案還是多個HTML檔案，如果選擇的話Fireworks會為每個按鈕產生一個自己的HTML頁面，在這個頁面上按鈕處於Down的狀態。如果要決定HTML檔案的檔案名稱就要回到Link Wizard視窗的File Name部分，不使用自動命名而手工輸入按鈕的檔案名稱，這樣按鈕的檔案名稱就會與輸出後的HTML檔案名稱相對應。


從按鈕和導航條的建立中我們可以體會到Fireworks方便之處，它是真正為Web創作而設計的軟體，以前在Photoshop中為了一個按鈕的動態效果輸多個檔案，調整後再次輸出多個檔案的日子一去不複返了。