创建按钮（Buttons）和导航条（Navigation Bars)<下> >>三湘时空-IT知识库[www.sxsky.net]

创建按钮（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中为了一个按钮的动态效果输多个文件，调整后再次输出多个文件的日子一去不复返了。

上一篇:创建动画（Animation)<下>

下一篇:使用热区和切割（Hotspots and Slices）（上）