45IT.COM- 电脑学习从此开始!
DIY硬件教程攒机经验装机配置
设计Photoshop网页设计特效
系统注册表DOS系统命令其它
存储主板显卡外设键鼠内存
维修显卡CPU内存打印机
WinXPVistaWin7unix/linux
CPU光驱电源/散热显示器其它
修技主板硬盘键鼠显示器光驱
办公ExcelWordPowerPointWPS
编程数据库CSS脚本PHP
网络局域网QQ服务器
软件网络系统图像安全
页面导航: 首页 > 设计学院 > Photoshop >

Fireworks另类探照灯效果制作

电脑软硬件应用网 45IT.COM 时间:2005-12-30 19:29 作者:45IT收集

 
  Fireworks作为网页制作三剑客之一,有着非常强大的功能!在Flash中,我们可以实现一种好似探照灯的动画效果,而这种精彩的效果,在它的“同门兄弟”Fireworks 4中,也同样可以轻松实现,而且步骤简洁明了!如果你也感兴趣的话,就和我一起来搞定它吧!

  前期制作

 
  1、打开Fireworks 4,新建一个空白的文件,将它的大小设定为300×100,背景色为黑色,其余不需调整。


图1

  2、制作左右滚动的球体。选择菜单“Insert→New Symbol”创建一个新符号。在弹出对话框中的Name项中为它取一个名称,这里我们输入“Ball”;在Type项中选取Graphic,确定即可。

  3、用椭圆工具配合Shift键,画一个正圆,按照图1将它填充好颜色。我们可以发现,刚编辑的圆形矢量图已经在Library面板里表现出来了。

  4、再次选择“Insert→New Symbol”创建一个新符号。这次,在弹出对话框的Type选项中选择“Animation(动画)”选项,Name为“Move Ball”。

  5、从Library图库中选中Ball,并将它直接拖到Move Ball的编辑窗口中。我们可以把这个Ball放在Stage左侧的位置上。

  6、重复第5步的方法再次拖动一个Ball放置到Stage上,这次放置到Stage的右侧。还有另外一种方法也可以实现,就是选中第一次拖到Stage的Ball,点选菜单项中“Edit→Clone”(可以使用快捷键Ctrl + Shift + D)复制一个Ball,然后将Clone后的Ball放置到编辑区的右侧,得到最终效果如图2所示。


图2

  7、按住“Shift”键或者按组合键“Ctrl + A”,全部选中编辑区中的两个符号(Symbol)。然后,选择菜单“Modify→Symbol→Tween Instances”,并在弹出的菜单中勾选“Distribute to Frames”。到现在,Move Ball的动画效果就制作完毕了。点击编辑区左下角快捷工具栏的播放按钮看一下动画效果吧!

  怎么样,看到了吗?不过,请先别着急,小歇一下,我们继续以下操作!

  效果实现

  1、制作通过Mask遮罩产生探照灯的最终效果。在主编辑区(Stage)中输入文字“Fireworks”。再将刚才做好的Animation Symbol动画Move Ball拖到编辑区中。在出现的对话框中选择“确定”,这时Fireworks就会自动在当前帧的基础上增加动画需要的实际帧数。点击快捷工具栏的“播放”按钮便可以看到刚才所做的动画在主编辑区播放了。这时候你可以调整一下Move Ball的位置,最好让其居中显示(如图3)。


图3

  2、选中刚才输入的文字,剪切它后选择菜单栏中的“Edit→Paste As Mask”。OK!那就请赶快点一下左下角快捷工具栏中的“Play”键,接下来就请慢慢欣赏你自己的大作吧(如图4)!


图4

  呵呵,怎么样,还满意吗?不过,要提醒你的是:一定要记得将输出格式变为Animated Gif格式,而不是单纯的GIF格式!这样才能实现我们想要的探照灯的动画效果!


 

 

顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
无法在这个位置找到: baidushare.htm
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
验证码:点击我更换图片
推荐知识