gggds 发表于 2009-12-27 13:39:31

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
[*]保证左边的按钮正处于被选择状态
[*]放置文字在按钮暗灰色的区域上
http://www.blue1000.com/upload/2005_01/050115201620261.gif
   创建这个按钮的Up状态:
[*]在按钮编辑窗口中单击\\\"Over\\\"标签
[*]单击\\\"Copy Up Graphic\\\"按钮
[*]对图形做下面这些改变:把填充颜色由暗灰色改成同文字一样的颜色#FFCC66
[*]改变文字的颜色为暗灰色(把按钮和文字的颜色互换)
[*]关闭按钮编辑器
http://www.blue1000.com/upload/2005_01/050115201620262.gif
  用简单的按钮创建导航条......  用简单的按钮创建导航条
[*]选择\\\"Adventure Planner\\\"这个简单的按钮
[*]按下Option(Mac)或者Alt(PC)键来向下拖动复制这个按钮
[*]再复制四个按钮,使按钮的总数达到六个
[*]所有的按钮排成二行,每行三个。第一行为1,3,5,第二行为2,4,6
http://www.blue1000.com/upload/2005_01/050115201620263.gif

[*]全选这六个按钮,并使用Info面板,使它们的放置位置为x=150,y=25
[*]选择第二号复制的按钮
[*]在Object面板,把文字\\\"ADVENTURE PLANNER\\\"改成\\\"\\\"GEAR\\\"
[*]按下回车键
http://www.blue1000.com/upload/2005_01/050115201620264.gif

[*]通过单击当前的按钮来确定只改变当前的按钮
[*]把余下的四个按钮文字更改如下:
[*]#3-\\\"BOOK FLIGHTS\\\"
[*]#4-\\\"CHECK CONDITIONS\\\"
[*]#5-\\\"TRAVEL LOGS\\\"
[*]#6- \\\"TRAVEL CHAT\\\" 在文件中单击Preview标签来预览这个交互式的按钮
http://www.blue1000.com/upload/2005_01/050115201620265.gif
  建立图片翻转按钮......   打开文件Demo_07.png或者继续在演示文件中工作。  在这部分,我们将为这些活动的图标建立 \\\"翻转图\\\"效果。  建立图片翻转按钮
[*]单击\\\"compass layout\\\"层并选择它
[*]在Frame面板中,单击底部的增加新帧的图标
[*]当第二帧被选中,选择文字工具并在左边铁锈红的区域上单击以输入文字
[*]键入\\\"Hit the beaches of Southern California this summer with the pros.\\\"
[*]文件格式为Verdana, bold, 12 point,黄颜色#FFCC66(颜色和下面的新月牙颜色一样)
http://www.blue1000.com/upload/2005_01/050115201620266.gif

[*]在帧面板,选择Duplicate Frame,复制的数目为6
[*]选择第三帧,双击改变文字为\\\"Explore the Seattle area by kayak. A 10 day adventure.\\\"
[*](如果你喜欢你可以改变其他的帧,或者干脆打开Demo_08.png)
[*]选择切图工具,添加一个切片在你刚增加的文字的附近(把这个切片一直拉到文件的底部)
http://www.blue1000.com/upload/2005_01/050115201620267.gif

[*]在帧面板,确信第一帧被选中
[*]用Subselect工具,按住Shift键,选中所有的矩形外框位图图标
http://www.blue1000.com/upload/2005_01/050115201620268.gif

[*]从菜单中选择Insert/Hotspot
[*]在对话窗口中选择\\\"Multiple\\\"
[*]在它们的外面单击取消选中热区
[*]在Surfing图象的热区上单击来选定它
[*]单击并拖动中心圆点图标到你在下面新建立的切片上
[*]在弹出窗口中,确信\\\"Frame 2\\\"被选定,且单击OK
http://www.blue1000.com/upload/2005_01/050115201620269.gif

[*]选择下一个热区,单击和拖动这个中心图标到切片物体
[*]这时,选择\\\"Frame 3\\\"作为源目标
[*]继续单击和拖动剩余的热区的中心图标到切片中,每次选择适当的帧来做为源目标的交换
[*]单击Preview标签来预览这个图片翻转
http://www.blue1000.com/upload/2005_01/0501152016202610.gif

[*]创建弹出菜单
[*]在文件的顶部的导航条中选择\\\"Gear\\\"按钮
[*]在菜单中选择Insert/Pop-up
http://www.blue1000.com/upload/2005_01/0501152016202611.gif

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

[*]单击Finish按钮  用commands执行图象翻转的批处理命令......打开Demo_09.png文件或者继续使用演示文件  用commands执行图象翻转的批处理命令
[*]打开History 面板
[*]在文件中,按住shift选择这三个矢量的图标和他们的\\\"more\\\"按钮一起(在主要的白色区域)
[*]在Frame面板,选择\\\"Copy to Frames\\\"并选择\\\"Next Frame\\\"操作
http://www.blue1000.com/upload/2005_01/0501152016202613.gif

[*]让我们自动地把这三个按扭变成图象翻转按扭
[*]在白色的主区域选择第一个按钮(在\\\"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\\\"命令
http://www.blue1000.com/upload/2005_01/0501152016202614.gif

[*]或者
[*]在历史面板,点击\\\"command script\\\",并点击Replay按钮
[*]点击第一帧,并选择最后一个按钮
[*]然后,在History面板选择\\\"Make rollover button\\\"或者在历史面板重新执行\\\"command script\\\"
页: [1]
查看完整版本: Fireworks 4功能指南之二