《网页制作：项目10 使用时间轴制作动画--ppt》由会员分享，可在线阅读，更多相关《网页制作：项目10 使用时间轴制作动画--ppt（10页珍藏版）》请在金锄头文库上搜索。
1、主讲：网页设计与制作 Dreamweaver 8项目十 使用时间轴制作动画任务一 使用层设置公园背景和标题任务二 使用时间轴设置运动效果项目十： 使用时间轴制作动画网页设计与制作 Dreamweaver 8任务一小 结任务二实 训任务一 使用层设置公园背景和标题本任务将首先使用层布局页面中的公园地图及标题 等内容。关于层的基本知识在项目九已作详细介绍，经 过本任务的学习,读者可以进一步巩固其具体应用。Dreamweaver 8网页设计与制作项目十： 使用时间轴制作动画关于本任务的基本操作过程是：（1）创建一个层“MapLayer”，宽度设置为“800px”，高度设置 为“480px”，背景图像
2、设置为“images/map.gif”。 使用层设置公园背景和标题操作动画任务一小 结任务二实 训（2）在层“MapLayer”中插入一个嵌套层“TitleLayer”并进行 属性设置。 Dreamweaver 8网页设计与制作项目十： 使用时间轴制作动画任务一 使用层设置公园背景和标题（3）设置CSS样式并输入文本“公园导游图”。任务一小 结任务二实 训时间轴是与层密切相关的一项功能，它可以在 Dreamweaver中实现动画的效果。通过时间轴，可以让层的位置 、尺寸、可视性和重叠次序随着时间的变化而改变，从而创建出 具有Flash效果的动画。本任务主要是利用时间轴制作人沿着公 园道路前进的
3、效果。通过本任务的学习，需要掌握的内容有：1、了解【时间轴】面板并掌握其使用方法 Dreamweaver 8网页设计与制作项目十： 使用时间轴制作动画任务二 使用时间轴设置运动效果使用时间轴设置运动效果操作动画任务一小 结任务二实 训2、添加对对象到时间轴时间轴 在主菜单中选择【窗口】【时间轴】命令打开【时间轴】面 板，然后选定对象，并在主菜单中选择【修改】【时间轴】【 添加对象到时间轴】命令将对象添加到【时间轴】面板或者将对象 直接拖曳到【时间轴】面板。 Dreamweaver 8网页设计与制作项目十： 使用时间轴制作动画任务二 使用时间轴设置运动效果3、快速创建一个复杂路径的时间轴动画的方
4、法如果需要创建具有复杂运动路径的动画，可以使用录制层路径 功能。首先在主菜单中选择【修改】【时间轴】【录制层路径 】命令，然后在文档中拖动层来录制路径，最后在动画要停止的地 方释放鼠标左键， 这时将自动在【时间轴】面板中添加对象，并 且较为合理地创建了一定数目的关键帧。也可以根据实际情况对各 关键帧的位置适当进行调整使其更为合理。 任务一小 结任务二实 训4、改变时间轴动画播放时间的方法在【时间轴】面板中拖动最后一个关键帧可以改变整个动画的播放时间，往右拖动是延长播放时间，往左拖动是缩短播放时间。5、设置时间轴动画为自动循环播放的方法在【时间轴】面板中勾选【自动播放】和【循环】两个复选框，可使
5、时间轴动画在页面打开时能够自动循环播放。Dreamweaver 8网页设计与制作项目十： 使用时间轴制作动画任务二 使用时间轴设置运动效果任务一小 结任务二实 训实训 制作飞机飞行动画本项目着重介绍了利用层和时间轴制作动画的基本方法。 实训将使用层和时间轴制作如图所示的飞机飞行动画，以进一 步巩固时间轴的应用。Dreamweaver 8网页设计与制作项目十： 使用时间轴制作动画实训结果文件见“项目结果”文件夹中的“shixun.htm”。【实训目的】 l进一步认识时间轴的作用。 l进一步巩固手动创建时间轴动画的基本方法。 l进一步巩固利用时间轴改变图像与层属性的方法。 任务一小 结任务二实 训实训 制作飞机飞行动画Dreamweaver 8网页设计与制作项目十： 使用时间轴制作动画任务一小 结任务二实 训小结本项目通过公园导游图动画介绍了时间轴的一些基 本功能和方法，同时也让读者对层这个概念有了更进一 步的了解。时间轴和层就像一对钥匙和锁，只有将它们 配成对，才能打开网页动画的大门。 Dreamweaver 8网页设计与制作项目十： 使用时间轴制作动画任务一小 结任务二实 训
