第33章 创建和编辑切片、热点

若创建切片，可执行如下操作之一： 方法一：在已有对象或区域上使用“编辑/插入 /矩形切片”命令创建矩形切片。 方法二：使用“切片”工具来绘制切片对象。
若插入切片，可执行如下操作： （1）选择要创建切片的对象或者区域。 （2）选择“编辑/插入/矩形切片”命令。 （3）图中的红色辅助线是切割图像的 依据，称为“切片辅助线”；可以通过 “视图/切片辅助线”命令来显示和隐 藏它，选择“视图/辅助线/编辑辅助线” 命令，可以在弹出的对话框中改变辅助 线和切片颜色。
选择工具面板网页分类中的“切片”工具 或 “多边形切片”工具 。在画布上拖动，绘制 切片。 注意：切片工具只能绘制出矩形的切片，如果 要绘制其他形状的切片，可使用多边形切片工 具。
可以用几种方法命名切片： 方法一：自定义命名切片。 方法二：在属性面板中命名切片。选中切片，在属性 面板的对象名称对话框中输入新名称，即可命名切片。 方法三：在层面板中命名切片。在“层”面板中，可 以看到刚刚创建的切片，Fireworks为每个切片创建了 一个层，这些层处于“网页层”之中。要重命名切片， 只要双击该切片字段，切片的字段变空，在空白的名 字域内输入新名字就可以重命名切片了。 方法四：自动命名切片。将切片导出时，Fireworks会 为每个切片自动命名。
编辑切片对象的方法与编辑图像对象的方法一 样。使用工具箱中的“指针”工具或“部分选 定”工具，单击要编辑的切片对象，可以进行 删除、移动、缩放、变形等操作。 单击选中切片，再单击“修改/变形”选单下的 命令，用鼠标拖动调整，可以将切片变形。随 着鼠标拖动调整，生成切片的分割线也跟着自 动调整，在调整好切片后，按回车键即可获得 修改后的切片对象。
若创建基本的弹出菜单，操作步骤如下： （1）调出“弹出菜单编辑器”对话框。单击该对话框中的“添加菜单”按钮，添 加一个空菜单项（在当前菜单项行的下边）。双击“文本”栏下的单元格也可以 添加一个空菜单项。 （2）双击每个单元格并输入或选择适当的内容。 “文本”栏文本框：用来输入指定给选单项的文本内容。 “链接”栏文本框：用来确定该菜单项的URL。若已经为文档中的其他网页对象输 入了URL，则这些URL将在该列表框中列出，可供选择。 “目标”栏文本框：用来确定该菜单项URL的目标。可以输入自定义目标，也可以 从“目标”列表框中选择一个预设目标。 （3）在设置完一行的菜单项参数后，会在该行的下面自动添加一个空行，按回车 键即可进入下一行的菜单项设置。如果要从一个活动单元格导航到另一个单元格 并继续输入信息，可按Tab键在各单元格之间移动，也可以通过按向上和向下的光 标移动键垂直滚动菜单项列表。 （4）重复步骤（2）和（3），直到添加了所有的菜单项。如果要删除某一个菜单 项，可单击该菜单项，然后单击“删除”选单按钮。 （5）单击某一行菜单项，再单击按钮可以使选中的菜单向右缩进（成为一级子菜 单），单击按钮，可以使选中的菜单命令向左缩进（成为上一菜单）。 （6）单击该对话框的“继续”按钮，又可进入菜单的外观设置。单击“继续”按 钮，可进入菜单的高级设置，再单击“继续”按钮，可以进入菜单的位置设置； 单击选择另一个选项卡，也可以进行相应的菜单设置。 （7）单击“完成”按钮，关闭“弹出菜单编辑器”，完成弹出菜单的创建。
在Fireworks 8中创建交互效果的基本生成块是切片对象。Fireworks 8提供了拖放变换图像方法使切 片产生交互的效果，它是最简单的制作切片交互的方法，只需拖动切片的行为手柄并将它放在目标 切片中，即可快速创建简单的交互效果。 变换图像：当鼠标指针经过一个切片时该切片中的图像所发生的变化，其最终结果通常称为变换图 像。变换图像是在网页浏览器中当指针经过其上方移动时，其外观发生更改的图形。 当选定切片时，一个带有十字的圆圈出现在切片的中央。这称为行为手柄。单击鼠标右键，弹出如 选单。通过该选单，可以轻松地创建变换图像的效果。 “添加简单变换图像行为”：使用同一网页对象下面帧上的另一幅图像来交换图像（可以从任何帧 中选择交换图像）。简单变换图像只涉及一个切片或热点。 “添加交换图像行为”：使用同一网页对象下面帧上的另一幅图像或外部图像来交换图像。 “添加状态栏信息”：当鼠标指针移到切片之上时，网页状态栏中会显示事先设置的文本 信息。 “添加导航栏信息”：可改变导航栏按钮正常状态和鼠标经过状态的图像内容和显示状态。 “添加弹出菜单”：响应鼠标指针滑过网页对象时显示的选单，在选单中创建子选单。 注：除变换图像外，还可使用“行为”面板向切片中附加其他类型的交互效果。可通过编辑现有行 为来创建自定义交互。单击“窗口/行为”，打开“行为”面板，再单击“行为”面板中的按钮，可 弹出附加的其他类型的交互效果，如图33-1-4所示。 尽管可以使用“行为”面板创建简单变换图像，但还是建议使用拖放变换图像的方法。
33.2.3.1 创建热点链接地址 选中热点，其属性面板如图33-2-1所示。 在属性面板中设置热点属性,其中各选项含义如下： 在“链接”输入框中输入链接文档的URL地址，是图像映射的关键。 在“替代”输入框中输入图像提示信息，提示信息在图像下载过程或图像下载失 败时显示，当鼠标放在图像上时也会出现图像提示信息。 在“目标”输入框中设置链接文档的显示位置。 可以在此设置宽、高、位置和形状，还可以在颜色对话框中选择热区的颜色。 33.2.3.2 “URL”面板 为网页对象指定URL时，将创建一个指向诸如网页这样的文件链接。可以为热点、 按钮和切片对象指定URL。如果图像中创建的热点比较多，链接地址也较多，如果 打算多次使用同一个URL，应如何管理这些URL链接地址呢？可以在“URL”面板中 创建一个URL库，并将这些URL储存在该库中。可使用“URL”面板添加、编辑和组 织URL。 单击“窗口/URL”选单命令，打开“URL”面板，在“当前URL”文本列表框中输入或 选择URL地址。 还可以使用“URL”面板选单帮助管理各URL地址。 单击按钮，可以将输入的URL添加到选中的URL库中，单击按钮，可以从库中删除 URL按钮。
来自百度文库
选择切片，可用选择工具在画布上选取或者在层面板中单击 切片所在的层。选定切片后，属性面板如图所示。
应用属性面板，可以很方便地设置切片,切片的属性如下 ： 链接：在“链接”文本框内输入URL，为切片添加超链接。 替代：在“替代”文本框内输入替代该切片的文字，当该切 片不能显示时，显示替代文字。 目标：在“目标”下拉列表中设置链接文档打开的位置。 高和宽：设置切片的大小。另外移动引导线可改变切片的大 小和位置，也可以将缩放、倾斜、扭曲工具应用到切片。
可以通过拖动热点的控制手柄，来改变热点的 范围，也可以在“信息”面板或“属性”面板 的“高度”和“宽度”框中输入数值，设置热 点的范围和位置大小。也可使用“缩放”工具、 “倾斜”工具和“扭曲”工具对热点工具进行 操作。 注：在“属性”面板的“热点形状”下拉列表 框中选择“矩形”、“圆形”或“多边形”。
如果要编辑弹出式菜单，可再调出“弹出菜单 编辑器”对话框。在画布中，创建弹出菜单的 切片或热点会显示一条蓝色的行为线，该行为 线附加在弹出菜单的顶级菜单轮廓上。 在导出文件后，如果要查看弹出菜单，可按 F12键或双击生成的网页，浏览器中就会显示 网页。当鼠标指针移到切片所在的图像位置时， 可以调出设置的弹出式菜单，单击菜单命令， 可以调出相应的网页。
本章主要讲解了切片概念、使用切片将交互性 结合到网页中，以及使用热点将交互性结合到 网页中。热点通常用于创建图像映射，热点还 可以接收鼠标事件，使得JavaScript行为在切片 中起作用。
利用切片制作两幅图像切换的效果。
热点是指网页图形中链接到URL的区域。可以 为图像创建多个热点，链接到不同的对象，这 种方式称为图像映射。
用选择工具选择要创建热点的图像，选择有明 显区域的图像，在制作热点时较为方便。
在源图像中标识出可作为很好的导航点区域后，就可以创建热点，然后为 它们指定URL链接。 33.2.2.1 利用“工具”箱中的“热点”工具创建热点 若创建矩形、圆形或多边形热点，可执行如下操作： （1）从“工具”面板的“网页”部分选择“矩形热点”工具、“多边形 热点”工具、“圆形热点”工具。 （2）拖动热点工具，在图像的某个区域上绘制热点。 注：按住Alt键可从中心点开始绘制。 33.2.2.2 通过跟踪对象来创建热点 若通过跟踪一个或多个选定对象来创建热点，可执行如下操作： （1）选择“编辑/插入/热点”。 （2）如果已选择多个对象，则会显示一条消息，询问是要创建覆盖所有 对象的单个矩形热点，还是要创建多个热点，其中每个对象对应一个热点。 （3）单击相应的按钮完成添加热点。
“外观”选项卡： 设置每个菜单单元 格的“释放状态” 和“滑过状态”以 及菜单的垂直和水 平方向。
“高级”选项卡： 设置单元格尺寸、 边距、单元格边框 宽度和颜色、菜单 延迟以及文字缩进 等。
“位置”选项卡：设 置菜单和子菜单位置。 其中，“菜单位置” 栏用来设置主菜单相 对于切片的位置，包 括切片的底部、右下 部、顶部或右上部。 “子菜单位置”栏用 来设置子菜单相对于 父菜单的位置，包括 父菜单的右侧、右下 部或底部。
选择一个切片或热点，它们即成为 弹出菜单的触发区域。然后，单击 “修改/弹出菜单/添加弹出菜单”命 令，调出“弹出菜单编辑器”对话 框。 另外，还可以单击切片中间的行为 手柄，弹出它的菜单，再单击该选 单中的“添加弹出菜单”选单命令； 或者单击“切片”选单中的“添加 弹出菜单”选单命令，来调出“弹 出菜单编辑器”对话框。 “弹出菜单编辑器”对话框有4个选 项卡，它们的作用如下： “内容”选项卡：设置基本的菜单 结构和每个菜单项的文本内容、URL 链接和目标内容。
第33章
创建切片。 创建热点。
切片是Fireworks中用于创建交互性的基本构造块。切片是网页对 象，它们不是以图像的形式存在，而是最终以HTML代码的形式出 现，用户可以通过“层”面板中的“网页层”查看、选择和重命 名。 将图像切片至少有3个主要优点： （1）“优化”。网页图形设计的挑战之一是在确保图像快速下载 的同时保证质量。切片可以使用最适合的文件格式和压缩设置来 优化每个独立切片。 （2）“交互”。可以使用切片创建这样的区域，即当用户的指针 经过这些区域或对其进行单击时它们会作出响应。 （3）“更新网页的某些部分”。切片可以轻松地更新网页中经常 更改的部分。例如，某公司的网页中包含每月更改一次的“本月 雇员”部分。使用切片可以快速更改雇员的姓名和照片部分而不 用更换整个网页。
弹出菜单是指为响应鼠标指针滑过网页对象（例 如切片或热点）时显示的菜单。弹出菜单项可以 附加URL链接以便于导航。例如，可以使用弹出 菜单来组织与导航栏中的某个按钮相关的若干个 导航选项，在弹出菜单中创建子菜单。 每个弹出菜单项都以HTML或图像单元格的形式显 示，并具有“释放”和“滑过”状态，而且在这 两种状态中都包含文本。可以通过按F12键在浏览 器中预览弹出菜单。