项目十时间轴-制作飞行动画-PPT.ppt

Dreamweaver 8中文版 网页制作基础,项目九 Div布局搜索网页,任务一 使用层制作天空背景,任务二 使用时间轴制作运动效果,实训 使用层和时间轴制作“演员表”动画,时间轴是Dreamweaver 8的一项重要功能，它与层相结合可以实现动画的效果。本项目以空中飞行动画为例，介绍使用时间轴制作动画的基本方法。,任务一 使用层制作天空背景,本任务主要是创建背景层和标题层。这是已经介绍过后知识，此处不再解释。,任务二 使用时间轴制作运动效果,需要掌握的内容主要有： 1、【时间轴】面板 2、增加对象到时间轴 3、控制动画播放 4、添加或删除帧 5、录制层路径 6、用时间轴改变图像与层的属性,【时间轴】面板用于显示层与图像随时间变化的属性。在主菜单中选择【窗口】【时间轴】命令打开【时间轴】面板。,1、【时间轴】面板,（1）在主菜单中选择【修改】【时间轴】【增加对象到时间轴】命令将层添加到【时间轴】面板； （2）也可以将层直接拖曳到【时间轴】面板。 （3）单击【时间轴】面板右上角的 按钮，在弹出的菜单中选择【添加对象】选项。 此时，一个动画条出现在时间轴的第1个通道中，层的名字也出现在动画条中。,2、增加对象到时间轴,在【时间轴】面板中拖动第1个关键帧或者最后一个关键帧，可以改变整个动画的播放时间，往右拖动是增长，往左拖动是缩短。,3、控制动画播放,在拖动过程中动画里的所有关键帧都将按比例发生位移，而彼此之间的位置不发生变化。如果不想让各关键帧随着总长度的变化而变化，只要在拖动最后一个关键帧时按住Ctrl键即可。,选中一个或者所有与该动画关联的动画条（按下Shift键来同时选中多个动画条），并向左或者向右拖动动画条，可以改变动画的开始时间。,要使时间轴动画在页面打开时能够自动播放，需要勾选【自动播放】复选框。 要使时间轴动画连续循环播放，应在【时间轴】面板中勾选【循环】复选框。,1、选择主菜单中的【修改】/【时间轴】/【添加帧】命令，在播放头右边加入1帧。 2、选择主菜单中的【修改】/【时间轴】/【删除帧】命令，在播放头右边删除1帧。 3、选定整个动画条，选择主菜单中的【修改】/【时间轴】/【增加关键帧】命令，在当前播放头位置加入关键帧。 4、选定某关键帧，选择主菜单中的【修改】/【时间轴】/【删除关键帧】命令，将当前关键帧删除。,4、添加或删除帧,如果需要创建具有复杂运动路径的动画，一个一个地创建关键帧会花费许多时间。还有一种更加高效而简单的方法可创建复杂运动轨迹的动画，这就是录制层路径功能。 （1）首先在主菜单中选择【修改】【时间轴】【录制层路径】命令，（2）然后在文档中拖动层来录制路径，（3）最后在动画要停止的地方释放鼠标左键，Dreamweaver 8将自动在【时间轴】面板中添加对象，并且较为合理地创建了一定数目的关键帧。 这时也可以根据实际情况对各关键帧的位置适当进行调整使其更为合理。,5、录制层路径,通过时间轴可以改变层的位置，从而产生动画的效果。另外，还可以利用时间轴来改变图像源文件及层的可见性、大小和重叠次序。要改变层的大小，可以拖动层的大小调整手柄或在【属性】面板的【宽】和【高】选项的文本框内输入新的值。要改变层的重叠次序，可以在【Z轴】选项的文本框内输入新的值或用【层】面板来改变当前层的重叠次序。将这些功能综合利用就可以制作出时隐时现的动画效果。,6、用时间轴改变图像与层的属性,实训 使用层和时间轴制作“演员表”动画,本项目主要介绍了使用层和时间轴制作动画的基本方法，本实训将让读者进一步巩固所学的基本知识。 要求：把“项目实训素材”文件夹下的内容复制到站点根文件夹下，然后创建网页并使用层和时间轴制作如图所示的动画网页。,制作“送孟浩然之广陵”网页,制作“送孟浩然之广陵”网页,小结,本项目通过飞机飞行动画介绍了时间轴的一些基本功能和使用方法，同时也让读者对层这个概念有了更进一步的了解。下面把创建时间轴动画应该注意的问题进行简要总结，以供读者参考。 （1）当需要改变图像源文件时，最好将图像放在层当中，不要单独改变图像源文件。切换图像源文件会减慢动画，因为新图像必须要重新下载。如果图像被放在层里面，那么在动画运行之前所有的图像被一次下载完，将不会有明显的停顿或者丢失图像现象。,（2）如果动画看上去不是很连贯且图像在位置间有跳动时，可以通过拉长动画条使运动效果平滑。使动画条更长将在运动的起点与终点间创建更多的数据点，同时也使得对象移动