Fireworks基础教程(十五)
Alt——在网页浏览时，当鼠标移到该按钮上时将要显示的提示内容；
　　目标——选择是否在新的浏览窗口中打开所链接的内容。
　　对于按钮链接区域的设置还可以使用“Web”工具区中的“多边形热点”工具为按钮或图绘制链接区域，如图8—14。

图8—14

　　“多边形热点”工具的使用方法与“多边形切片”工具是一样的。
　　在为链接区域添加链接对象时还也可以使用“UBL”面板，如图8—15。

图8—15

　　在该面板的第二个输入栏中可直接输入“切片”或“热点”区域的链接地址，然后点击“添加链接” 按钮将地址添加到下面的链接窗口中。使用时只需在该窗口中点选当前“切片”或“热点”区域所要用到的链接地址即可。在“UBL”面板右下角的“新建URL” 按钮中，可以直接为链接窗口添加链接，或对链接窗口中已有的链接地址进行修改，如图8—16。

图8—16

　　图像变换技术在网页中经常被用到，即当鼠标移动到某图像或按钮上时，会触发另一个图形的显示。在Fireworks中，图像变换的制作原理就是使“帧”面板中某帧中的图形对象与来自任何帧的图象进行交换，从而达到在网页浏览时产生图形变换的效果。

　　1、简单的图像变换
　　在Fireworks中制作简单的图像变换，就是把“帧”面板中第1帧里的对象与第2帧中的图像进行交换。
　　我们先制作或引入一个按钮的一般状态图，选中图形后单击鼠标右键，从弹出菜单中选择“插入切片”或“插入热点”命令，如图9—01。

图9—01

　　然后在“帧”面板中新增加一帧，并在此帧上引入鼠标经过按钮时将要变换的图像，如图9—02。

图9—02

　　选中切片后，启动“行为”面板，点击“添加”   指令按钮，从中选择“简单变换图像”，如图9—03。

图9—03

　　这样，一个简单的变换按钮就制作完成了，按F12键就可以在浏览器中进行测试了。

图9—04

　　可以看到，不管你在第二帧中所导入的图像有多大，在网页浏览时也只能在相同的切片范围内看到两张图形的变换效果。因此，这种图象的变换又被称为“相交变换”

Fireworks基础教程(十六)
2、复杂的图像变换

　　先在画布上绘制或引入三个图形对象，然后同时选中这些对象，并在任意一个对象上单击右键，从弹出菜单中选择“插入切片”。这时会弹出一个提示窗口，如图9—07。

图9—07

　　选择“单一”按钮时，是把选中的全部对象设置在同一个大的切片区域内，而“多重”按钮则是为所有对象各设置一个独立的切片区域。在这里我们选择“多重”按钮后，如图9—08。

图9—08

　　接着，我们在“帧”面板内添加三个空白帧，如图9—09。

图9—09

　　在第2帧中引入“小猫”按钮切片所要变换的图形，并在该图形上点击右键选择“插入切片”命令，如图9—10。

图9—10

　　同样的，我们在第3和第4帧中也分别引入用于“鹦鹉”和“鲜花”按钮所要变换的图像，然后都在图像上点击右键，选择“插入切片”项。

图9—11

　　接着，点选“小猫”的按钮切片后使用“行为”面板上的“交换图像”指令，如图9—12，从而启动“交换图像”的详细设置对话框（图9—15）。

图9—12

　　或者用鼠标左键按住“小猫”按钮切片中间的圆形控制手柄不放，然后拖拽鼠标到与其进行图像交换的切片上，这时会出现一条蓝色的链接曲线，如图9—13。

图9—13

松开鼠标后会弹出一个“交换图像”的设置窗口，在下拉菜单上选择与“小猫”按钮切片进行交换的图像所在的帧。在这里我们选择“帧2”。

图9—14

　　如果点击“更多选项”按钮，也可以启动“交换图像”的详细设置对话框，如图9—15。

图9—15

图9—16

　　用同样的方法为“鹦鹉”和“鲜花”按钮在“交换图像”对话框中设置不同的交换图像。三个按钮切片设置完成后如图9—17。

图9—17

　　按F12键即可在浏览器上测试制作效果了，如图9—18。

图9—18

　　可以看到，点击不同的按钮图像，就会在不同的位置上显示相应的变换图形。因此，这种图象的变换效果又被称为“不相交变换”。
　　要修改设置内容时，选择切片后，点击“行为”面板右下角的“编辑” 按钮即可，如图9—19。

图9—19

3、输出HTML文件

　　点击Fireworks菜单栏中的“文件—导出”命令即可把制作的内容输出为HTML格式的文件，如图9—20。

图9—20

　　文件名——输入导出文件的名称；
　　保存类型——选择输出文件的保存格式。默认情况下是以HTML格式输出；
　　HTML——导出成HTML文件或把制作内容以GIF图像格式复制到剪切版中；
　　切片——可以选择是否导出切片；
　　仅已选切片——只导出事先被选取的切片；
　　仅当前帧——当制作对象有多个帧数时，可以事先选中某帧进行单独导出；
　　包括无切片区域——选择是否将无切片区域一并导出；
　　将图像放入子文件夹——可选择是否把导出的HTML文件与图片一起放在一个文件夹内。点击下面的“浏览”按钮可为图片选择一个子文件夹进行保存。
在Fireworks中，为图像设置链接区域是靠“切片”或“热点”工具来完成，因此“切片”或“热点”区域又被称为链接区域。它们不是以图像的形式存在，而是在图像导出成网页格式后，以HTML代码的形式出现.

Fireworks基础教程(十七)
1、切片与热点
　　网页层：所有的“切片”和“热点”区域都被保存在“层”面板中的“网页层”内，以划分它们与图像层的区别。但同时也可以像对待图像层那样对网页层进行例如重命名、选择、删除、展开/折叠层、隐藏/显示层、锁定/编辑层等操作，如图10—01。

图10—01

　　链接区的变形：对于各种形状的图形可为其选择不同的“切片”或“热点”工具，为图象划分出所需的切片或热点区域。同时也可以使用各种“变形”工具对该区域进行变形处理，如图10—02。

图10—02

　　设置链接：为图像设置好“切片”或“热点”的链接区域后，在其区域的属性对话框中就可以输入或设置链接的相关内容。如图10—03。

图10—03

　　而对于“切片”区域除了可以为图像设置一个链接范围以外，还可以将该范围作为HTML的语言区域进行导出。只需在“切片”属性框中的类型下拉列表里选择“HTML”项，如图10—04。

图10—04

　　然后点击类型列表下的“编辑”按钮即可在“编辑HTML切片”窗口中输入HTML代码。如此一来，也就把该切片区域转成了HTML的语言区域。

图10—05

　控制手柄：在“切片” 区域的中心有一个圆形的控制手柄，右键点击即可弹出这个切片目前所能用到的所有行为指令。如图10—06。

图10—06

　　导出所选切片——可把图像中的切片区域作为图像进行导出保存。在导出前，还可以使用“优化”面板对该区域进行各项设置，如图10—07。

图10—07

　　排列——调整该切片在网页层中上下的排列位置；
　　添加简单变换图像行为——为图形的切片区域建立简单的图形变换效果；
　　添加交换图像形为——可启动“变换图像”的详细设置窗口，为切片区域的图像建立较复杂的图形变换效果；
　　添加状态栏信息——选择该项后会弹出一个 “设置状态栏文本”对话框，在消息栏中可输入要显示在浏览器状态栏上的文字信息。如图10—08。

图10—08

　　添加导航栏——将图形的切片区域设置为网页的导航栏；
　　添加弹出菜单——在切片位置添加一个弹出菜单的按钮；
　　编辑弹出菜单——可重新设置弹出菜单中的各项内容。
同样的，在“热点”区域的中心位置上也有个控制手柄，点击右键即可弹出相关行为，如图10—09。

图10—09

　　为 “切片”或“热点”所添加的全部指令都保存在“行为”面板中。同时，点击“行为”面板上的“添加” 或“删除” 按钮也可以为切片、热点添加或删除相关的行为指令，如图10—10。

图10—10

Fireworks基础教程(十八)
2、制作弹出菜单
　　先制作或引入一个要用来制作弹出式菜单的主按钮，如图10—11。

图10—11

　　接着为该按钮添加一个切片或热点，并在其控制手柄的弹出菜单中选择“添加弹出菜单”项，如图10—11。

图10—11

　　此时将会启动“弹出菜单编辑器”窗口，如图10—12。

如图10—12

　　在“内容”选项卡中，点击“添加菜单项” 或“删除菜单项” 按钮，可在文本栏中加入或删除一个菜单项；
　　文本栏——可输入弹出菜单中各选项的名称；
　　链接栏——输入菜单菜单项所要链接的地址；
　　目标栏——选择链接对象在浏览器中的打开方式。
　　如果要把文本栏中某个菜单选项再设置为另一个菜单的下一级目录时，只需点击“下级菜单” 按钮即可。如图10—13；

图10—13

　　  可以看到，“菜单2”已成了“菜单1”的下级目录了。而点击“上级菜单” 按钮则可以将“菜单2”又向上恢复一级。
　　  菜单项上下位置的调整可能用鼠标的拖拽来完成，如图10—14，我们把“菜单5”向上移动了一格。

图10—14

　　在“内容”选项卡的设置完成之后，点击右下角的“继续”按钮，进入下“外观”选项卡，如图10—15。

图10—15

在单元格选项中，可以将弹出式菜单的风格设定为“HTML”或“图像”，而两种风格都可以在下面的预览框中先行查看；

　　在单元格右边的下拉列表中可以选择菜单的排列方式，分别有“垂直菜单”和“水平菜单”；
　　字体栏及旁边的文字设置工具，都是用于对菜单文字的各项设置；
　　在“弹起状态”框中有两个颜色选择框，分别用于菜单在弹起状态时，文字颜色及其背景色的设置；
　　在“滑过状态”框中也有两个颜色选择框，是用于菜单在鼠标滑过状态时，文字颜色及背景色的设置。
　　在“外观”选项卡的设置完成后，我们点击“继续”按钮，进入下一个选项卡。如图10—16。

图10—16

　　在“高级”选项卡中可以进一步对菜单的边框及边框颜色等进行详细的设置。完成后点击“继续”按钮。
　　在“位置”选项卡中可以对弹出菜单的弹出方式及位置进行设定，如图10—17。

图10—17

　　菜单位置——设置主菜单的弹出位置。也可以直接输入主菜单弹出位置的坐标值；
　　子菜单位置——选择子菜单的弹出位置，同样也可以在下面的坐标中直接输入相关数值。而取消“放在同一位置”选项时，则子菜单总会与它的上一级菜单在同一水平位置上弹出。
　　点击“完成”按钮后，弹出式菜单的制作就大功告成了，按F12键即可在浏览器中查看效果。

图10—18

Fireworks基础教程(十九)
在Fireworks中，自动化的应用可以为我们省去不少在图像处理或网页制作过程中一些相同步骤的操作，从而有效地节约时间和提高工作效率。
　　1、“查找”面板
　　使用“查找”面板可方便快捷地查找或替换文件中的文字、字体、颜色等内容。这对于较大的网页制作或图像处理都将带来极大的方便。

图11—01

　　先要在“搜索所选范围”栏中选择搜索范围。可按“搜索帧”、“搜索文档”和“搜索文件”进行范围选取。
　　当选择“搜索帧”时，将对当前文件中的所有帧列为搜索范围；
　　选择“搜索文档”时，则对当前Fireworks中打开的所有文件进行搜索；
　　“搜索文件”则对被选中的外部文件进行展开搜索。
　　在“搜索文件类型”栏中，还可以再进一步按文件或制作对象的类型进行搜索，如图11—02。

图11—02

　　选择不同的文件或制作对象，在该栏下就会显示与该搜索相对应的设置。例如，当选择“查找颜色”时“查找”面板如图11—03。

图11—03

　　在“查找”右边的颜色预览窗中选择所要查找的色彩，然后在“更改为”右边的颜色预览窗选择一种用来替换新的颜色。当点击下方的“查找”按钮时，只会把“查找”右边颜色预览窗的色彩找出来，而点击“替换”或“全部替换”时，则会将查找到的色彩进行更换。
2、使用批处理

　　当有大量的文件要做相同的处理操作时，使用“批处理”功能即可将这些文件按指定的操作步骤进行处理。点击菜单栏上的“文件—批处理”，如图11—04。

图11—04

　　在浏览框中选择要处理的文件后点击“增加”按钮即可把文件添加到列表框内；
　　选择“添加全部”时则是把浏览窗中的所有文件添加到列表框中；
　　点击“删除”按钮，又可以把列表框中被选中的文件名单删除。
　　将要处理的文件选择完后，点击“继续”按钮进入批处理的执行动作或命令选择窗口，如图11—05。

图11—05

　　在该窗口的左边的“批次选项”中选择执行文件处理的动作后点击“添加”按钮，即可把动作加入到右边的列表中。一次可以添加多个处理动作，而且点击右边列表中的两个箭头按钮     ，还可以设置执行动作时的先后顺序。对于不需要的动作指令也可以从列表中选中后点击“删除”按钮。在这里我们试着把刚才导入的两张图片的原有名称面前加上“时钟”两字，然后点击“继续”按钮，进入下一个设置步骤。

图11—06

　　在“批次输出”中，可以选择对图像执行批处理后的保存路径；
　　同时，你还可以选择是否对原图像文件进行备份。选择“覆盖现有备份”时，将覆盖原来的文件。选择“增量备份”时，将对上一次的备份文件进行重命名，也就是备份原来的文件；

　　当点击“保存脚本”时，则可将这次批处理的动作过程用脚本形式进行保存，以便下次再对其它文件进行相同的动作处理时，可直接调用该脚本文件。
　　设置完成后点击“批次”按钮，批处理动作被正式开始执行。同时，会有一个提示窗口显示当前已被处理完成的文件数量，如图11—07。

图11—07

　　点击“确定”后，整个批处理的过程就完成了。而那两张图像的名称也被成功的重命名了，如图11—08。

图11—08

　　而当下次还要使用这个批处理的动作时，可以点击菜单栏中的“命令—运行脚本”命令，如图11—09。

图11—09

　　然后在弹出的文件浏览窗中选择上次保存的那个脚本文件。此时还会弹出一个窗口，从中选择所要处理的文件。如图11—10。

图11—10

　　细心的朋友一定会发现，菜单栏中的“命令”列表里所列的动作指令与图11—05窗口左侧批次选项中的“命令”列表，其内容是完全一样的。其实，“命令”菜单中的动作指令也属批处理中的动作脚本。只不过在批处理窗口中还可以进一步为这些动作指令作出相关设置及执行上的时间安排.

Fireworks基础教程(二十)(一)

3、“历史记录”面板 　　在图形或网页的制作过程中难免会用到工具栏上的“撤消” 或“重做” 按钮，以恢复上一步或前一步的操作。但当所要撤消或重做的次数较多时，就可以直接在“历史记录”面板里点击左侧的箭头滑块，从而返回到想要的那一步操作。如图11—11。 图11—11 　　在默认的情况下，“历史记录”面板只能记录20条操作步骤。也就是说，当“撤消”的次数超出这个记录范围时，就不能再执行撤消命令。若想修改这个记录范围，可通过菜单栏上的“编辑—首选参数”。在常规选项卡内重新输入“撤消步骤”的数值。 　　因为“历史记录”面板里忠实地记录了每一步的操作过程，因此我们又可以把这些操作过程保存为脚本文件，方便下次再有相同的图像处理步骤时进行调用。方法是先在“历史记录”面板里把需要的操作步骤选中，如图11—12。 图11—12 　　然后点击面板右下角的“保存”按钮，此时会弹出一个“保存命令”的对话框。在“名称”栏中为这些操作记录取个名称，然后点击“确定”按钮。 图11—13 　　此时点击菜单栏上的“命令” 菜单，就会在最后一项中看到“图形变形记录”的操作脚本命令已被保存其中。 图11—14