Fireworks 4功能指南之二


打开Demo_06.png在第2部分文件夹或者继续在你的演示文件中工作

　　创建一个交互式的网页 

在这段中，我们将会在我们的网页中增加交互性和动画
在层面板中建立一个新的层，并双击重命名为"Navigation Buttons" 
(将这个新层放在最上面，在compass版面的上面)，把它拖到那个位置
在Insert菜单中选择"New Button"
选择长方形工具并拖出一个矩形
在Info面板中，设置它的尺寸为140W×20H
填充颜色为暗灰色#333333，笔触为1pixel basic笔触，暗青绿色#006666
复制这个矩形并进行粘贴
当这个复制矩形被选择时，使用Info面板调整它的尺寸为20W×20H
并且改变它的填充色为中青绿色#006699
从File菜单中选择Import,在第三部分文件夹中选择"Flag.png"
在中青绿色正方形上单击来放置这个Flag
·选择文字工具，在按钮上单击来输入文字
输入"ADVENTUREPLANNER"设置文字大小为12pt，字体为Impact，黄颜色#FFCC66
保证左边的按钮正处于被选择状态
放置文字在按钮暗灰色的区域上 




　　 创建这个按钮的Up状态： 

在按钮编辑窗口中单击"Over"标签
单击"Copy Up Graphic"按钮
对图形做下面这些改变:把填充颜色由暗灰色改成同文字一样的颜色#FFCC66
改变文字的颜色为暗灰色（把按钮和文字的颜色互换）
关闭按钮编辑器 




　　用简单的按钮创建导航条......
 　　用简单的按钮创建导航条 

选择"Adventure Planner"这个简单的按钮
按下Option(mac)或者Alt(PC)键来向下拖动复制这个按钮
再复制四个按钮，使按钮的总数达到六个
所有的按钮排成二行，每行三个。第一行为1，3，5，第二行为2，4，6 




全选这六个按钮，并使用Info面板，使它们的放置位置为x=150,y=25
选择第二号复制的按钮
在Object面板，把文字"ADVENTURE PLANNER"改成""GEAR"
按下回车键 




通过单击当前的按钮来确定只改变当前的按钮
把余下的四个按钮文字更改如下：

#3-"BOOK FLIGHTS"
#4-"CHECK CONDITIONS"
#5-"TRAVEL LOGS" 
#6- "TRAVEL CHAT" 在文件中单击Preview标签来预览这个交互式的按钮





　　建立图片翻转按钮...... 
 　　打开文件Demo_07.png或者继续在演示文件中工作。

　　在这部分，我们将为这些活动的图标建立 "翻转图"效果。

　　建立图片翻转按钮 

单击"compass layout"层并选择它
在Frame面板中，单击底部的增加新帧的图标
当第二帧被选中，选择文字工具并在左边铁锈红的区域上单击以输入文字
键入"Hit the beaches of Southern California this summer with the pros."
文件格式为Verdana, bold, 12 point,黄颜色#FFCC66（颜色和下面的新月牙颜色一样） 




在帧面板，选择Duplicate Frame,复制的数目为6
选择第三帧，双击改变文字为"Explore the Seattle area by kayak. A 10 day adventure."
（如果你喜欢你可以改变其他的帧，或者干脆打开Demo_08.png）
选择切图工具，添加一个切片在你刚增加的文字的附近（把这个切片一直拉到文件的底部） 




在帧面板，确信第一帧被选中
用Subselect工具，按住Shift键，选中所有的矩形外框位图图标 




从菜单中选择Insert/Hotspot
在对话窗口中选择"Multiple"
在它们的外面单击取消选中热区
在Surfing图象的热区上单击来选定它
单击并拖动中心圆点图标到你在下面新建立的切片上
在弹出窗口中，确信"Frame 2"被选定，且单击OK 




选择下一个热区，单击和拖动这个中心图标到切片物体
这时，选择"Frame 3"作为源目标
继续单击和拖动剩余的热区的中心图标到切片中，每次选择适当的帧来做为源目标的交换
单击Preview标签来预览这个图片翻转




创建弹出菜单
在文件的顶部的导航条中选择"Gear"按钮
在菜单中选择Insert/Pop-up 



在出现的窗口中，进行下面的操作
输入"Backpacks"
单击图标"+"来增加（注意：你也能在这儿输入URL）
然后，输入"No frame"
单击图标"+"来增加它
当"No frame"被选中时，点击蓝色的缩进图标
使用图象054.gif
现在输入"External frame"并单击"+"图标
输入"Internal frame"并单击"＋"图标
输入"Clothing"并单击"＋"图标
当"Clothing" 被选中时，点击蓝色的缩进图标(原文不是这个意思，但感觉不对)
输入"Jackets" 并单击"＋"图标
当"Jackets" 被选中时，点击蓝色的缩进图标
输入"Pants" 并单击"＋"图标
单击"Next"按钮
使用标准的HTML外观设置，但是把文字尺寸改为10pt（使用弹出窗口编辑器你既可以是HTML也可以是图象来创建你的按钮） 


单击Finish按钮


　　用commands执行图象翻转的批处理命令......
 打开Demo_09.png文件或者继续使用演示文件

　　用commands执行图象翻转的批处理命令
打开History 面板
在文件中，按住shift选择这三个矢量的图标和他们的"more"按钮一起（在主要的白易做图域）
在Frame面板，选择"Copy to Frames"并选择"Next Frame"操作 




让我们自动地把这三个按扭变成图象翻转按扭
在白色的主区域选择第一个按钮（在"Fly Fising in the Rocky Mountains"上面）
复制它
在Frame面板中，在第二帧上单击
粘贴它
选择菜单Modify/Send to Back
在FILL面板，选择填充的类型为Solid，选择颜色为桔黄色#FF9933
当按钮仍旧被选择时，选择菜单Insert/Slice
在切片上，在图标的中心单击来访问弹出菜单，选择"Add Simple Rollover Behavior" 
在History面板，按住Shift选择这八个步骤，从"Copy" 到"Edit Behavior"
单击磁盘图标把这些步骤保存成一个Command.
命名这个Command为"Make rollover button"
现在，单击第一帧下面，选择中间的按钮在"Level 5 Rapids"
现在，你可以任选其一
从Command菜单中选择"Make rollover button"命令


 

或者
在历史面板，点击"command script"，并点击Replay按钮
点击第一帧，并选择最后一个按钮
然后，在History面板选择"Make rollover button"或者在历史面板重新执行"command script" 

　　Fireworks 4功能指南之三...... 

　　　　　　　　　　　　　　　　　　　　　　　　　　本文来源于www.LoadSkill.com