《使用层和时间轴》ppt课件

1、第第7 7章运用层和时间轴章运用层和时间轴本章简介：本章简介： 假设用户想在网页上实现多个元素重叠假设用户想在网页上实现多个元素重叠的效果，可以运用层。层是网页中的一个区的效果，可以运用层。层是网页中的一个区域，并且游离在文档之上。利用层可准确定域，并且游离在文档之上。利用层可准确定位和重叠网页元素。经过设置不同层的显示位和重叠网页元素。经过设置不同层的显示或隐藏，实现特殊的效果。或隐藏，实现特殊的效果。Dreamweaver CS3Dreamweaver CS3提供了在网页上制造动提供了在网页上制造动态效果的功能，利用时间轴组织、控制层和态效果的功能，利用时间轴组织、控制层和图像等对象，在一

2、定时间内播放，从而产生图像等对象，在一定时间内播放，从而产生动态效果。动态效果。层的引入层的引入 在网页设计当中，层的概念的引入主要表现出两大在网页设计当中，层的概念的引入主要表现出两大优势：优势：在层出现之前，一切页面的规划具有很大的空间局限在层出现之前，一切页面的规划具有很大的空间局限性，早期的网页设计人员普通用表格来控制图形等性，早期的网页设计人员普通用表格来控制图形等网页元素的位置。但是假设要准确定位一个图形，网页元素的位置。但是假设要准确定位一个图形，那么必需在表格内进展表格嵌套，使设计变得非常那么必需在表格内进展表格嵌套，使设计变得非常复杂。当层出现以后，定位技术及其相关的设计就复

3、杂。当层出现以后，定位技术及其相关的设计就变的非常容易实现了。变的非常容易实现了。在层出现之前，一切的网页设计和制造都是在同一个在层出现之前，一切的网页设计和制造都是在同一个平面内进展的，可以利用的空间和设计的技术手段平面内进展的，可以利用的空间和设计的技术手段都非常有限，人们不得不在有限的空间对页面进展都非常有限，人们不得不在有限的空间对页面进展细致的略显繁琐规划规划，而在层出现之后，网页细致的略显繁琐规划规划，而在层出现之后，网页设计的空间由二维拓展成了三维，从而大大添加了设计的空间由二维拓展成了三维，从而大大添加了设计人员的自在空间。设计人员的自在空间。层的了解层的了解 网页中的层，就好

4、似一张张透明的网页中的层，就好似一张张透明的画布，每张画布都画着一些独立的颜色，画布，每张画布都画着一些独立的颜色，而一幅完好的画就是由许多张这样的画而一幅完好的画就是由许多张这样的画布叠加在一同组成的，每一个层的颜色布叠加在一同组成的，每一个层的颜色都可以和其它层进展叠加，而修正其中都可以和其它层进展叠加，而修正其中的某一层却不会影响其他层的效果，这的某一层却不会影响其他层的效果，这就是层的概念中心，也表达了层的作用。就是层的概念中心，也表达了层的作用。课堂学习目的课堂学习目的层的根本操作层的根本操作运用层设计表格运用层设计表格时间轴动画时间轴动画制造时间轴动画的技巧制造时间轴动画的技巧7.

5、17.1层的根本操作层的根本操作课堂案例课堂案例圣诞礼品屋圣诞礼品屋创建层创建层选择层选择层设置层的默许属性设置层的默许属性APAP元素面板元素面板更改层的堆叠顺序更改层的堆叠顺序更改层的可见性更改层的可见性调整层的大小调整层的大小嵌套层嵌套层挪动层挪动层对齐层对齐层层靠齐到网格层靠齐到网格7.1.17.1.1课堂案例课堂案例圣诞礼品屋圣诞礼品屋运用运用“绘制绘制 AP Div AP Div按钮绘制层。运用按钮绘制层。运用“APAP元素控制元素控制面板选择层。运用面板选择层。运用“背景颜色按钮改动层的背景颜色。背景颜色按钮改动层的背景颜色。7.1.27.1.2创建层创建层假想象利用层来定位网页

6、元素，先要创建层，假想象利用层来定位网页元素，先要创建层，再根据需求在层内插入其他表单元素。有时为再根据需求在层内插入其他表单元素。有时为了规划，还可以显示或隐藏层边框。了规划，还可以显示或隐藏层边框。创建层创建层单击单击“插入面板插入面板“规划选项卡中的规划选项卡中的“绘制绘制AP DivAP Div按钮，在文档窗口中拖曳鼠标绘制。按钮，在文档窗口中拖曳鼠标绘制。将将“插入面板插入面板“规划选项卡中的规划选项卡中的“绘制绘制AP DivAP Div按钮拖曳到文档窗口中。按钮拖曳到文档窗口中。将光标放置文档窗口中，选择将光标放置文档窗口中，选择“插入记录插入记录 规划对象规划对象AP DivA

7、P Div命令。命令。假设需求延续绘制新的层？假设需求延续绘制新的层？单击单击“插入面板插入面板“规划选项卡中的规划选项卡中的“绘制绘制AP DivAP Div按钮，在文档窗口中，按住按钮，在文档窗口中，按住CtrlCtrl键的同时拖曳鼠标左键的同时拖曳鼠标左键绘制层。只需不放键绘制层。只需不放CtrlCtrl键，就可以延续绘制新的层。键，就可以延续绘制新的层。7.1.27.1.2创建层创建层 在默许情况下，每当用户创建一个新的层，都在默许情况下，每当用户创建一个新的层，都会运用会运用DIVDIV标志它，并将层标志显示到网页左上标志它，并将层标志显示到网页左上角的位置。角的位置。 假设要显示层

8、标志？假设要显示层标志？编辑编辑 首选参数首选参数APAP元素的锚点元素的锚点查看查看 可视化助理可视化助理 不可见元素不可见元素7.1.27.1.2创建层创建层显示或隐藏层边框显示或隐藏层边框假设要显示或隐藏层边框，可选择假设要显示或隐藏层边框，可选择“查看查看 可视化助理可视化助理 隐藏一切命令。隐藏一切命令。7.1.37.1.3选择层选择层选择一个层选择一个层1 1利用层面板选择一个层。利用层面板选择一个层。窗口窗口APAP元素元素2 2在文档窗口中选择一个层。在文档窗口中选择一个层。单击层的边框单击层的边框按住按住Ctrl+shiftCtrl+shift，在层中单击，在层中单击单击选择

9、柄单击选择柄7.1.37.1.3选择层选择层选定多个层选定多个层选择选择“窗口窗口 AP AP元素命令，弹出元素命令，弹出“APAP元素控元素控制面板。在制面板。在“APAP元素控制面板中，按住元素控制面板中，按住键并单击两个或更多的层称号。键并单击两个或更多的层称号。在文档窗口中按住在文档窗口中按住键并单击两个或更多键并单击两个或更多个层的边框。中选定多个层时，当前层的大小个层的边框。中选定多个层时，当前层的大小调整柄以蓝色突出显示，其它层的大小调整柄调整柄以蓝色突出显示，其它层的大小调整柄那么以白色显示，并且只能对当前层进展操作。那么以白色显示，并且只能对当前层进展操作。7.1.47.1.

10、4设置层的默许属性设置层的默许属性当层插入后，其属性为默许值，假设想查看当层插入后，其属性为默许值，假设想查看或修正层的属性，选择或修正层的属性，选择“编辑编辑 首选参数首选参数命令。命令。“显示选项：设置层的初始显示形状。显示选项：设置层的初始显示形状。DefaultDefault：默许值，普通情况下，大多数阅：默许值，普通情况下，大多数阅读器都会默以为读器都会默以为“inheritinherit。InheritInherit：承继父级层的显示属性。：承继父级层的显示属性。VisibleVisible：表示不论父级层是什么都显示层：表示不论父级层是什么都显示层的内容。的内容。HiddenHi

11、dden：表示不论父级层是什么都隐藏层的：表示不论父级层是什么都隐藏层的内容。内容。“嵌套：设置在层出现重叠时，能否采用嵌套：设置在层出现重叠时，能否采用嵌套方式。嵌套方式。7.1.57.1.5APAP元素面板元素面板经过经过“APAP元素控制面板可以管理网页文档元素控制面板可以管理网页文档中的层。选择中的层。选择“窗口窗口 AP AP元素命令，启用元素命令，启用“APAP元素控制面板。元素控制面板。运用运用“APAP元素控制面板可以防止层重叠，元素控制面板可以防止层重叠，更改层的可见性，将层嵌套或层叠，以及选更改层的可见性，将层嵌套或层叠，以及选择一个或多个层。择一个或多个层。7.1.67.

12、1.6更改层的堆叠顺序更改层的堆叠顺序排版时常需求控制叠放在一同的不同网页元素的排版时常需求控制叠放在一同的不同网页元素的显示顺序，以实现特殊的效果，这可经过修正选显示顺序，以实现特殊的效果，这可经过修正选定层的定层的“Z Z轴属性值实现。层的显示顺序与轴属性值实现。层的显示顺序与Z Z轴值轴值的顺序一致。的顺序一致。Z Z值越大，层的位置越靠上前。值越大，层的位置越靠上前。在在“APAP元素控制面板中更改层的堆叠顺序元素控制面板中更改层的堆叠顺序在在“属性面板中更改层的堆叠顺序属性面板中更改层的堆叠顺序7.1.77.1.7更改层的可见性更改层的可见性 当处置文档时，可以运用当处置文档时，可以

13、运用“APAP元素控制面板手动元素控制面板手动设置显示或隐藏层，来查看层在不同条件下的显设置显示或隐藏层，来查看层在不同条件下的显示方式。更改层的可见性，有以下几种方法。示方式。更改层的可见性，有以下几种方法。运用运用“APAP元素控制面板更改层的可见性。元素控制面板更改层的可见性。单击眼形图标，可以更改其可见性。单击眼形图标，可以更改其可见性。眼睛睁开表示该层是可见的；眼睛睁开表示该层是可见的；眼睛闭合表示该层是不可见的；眼睛闭合表示该层是不可见的；假设没有眼形图标，该层通常会承继其父级的可见性。假设没有眼形图标，该层通常会承继其父级的可见性。假设层没有嵌套，父级就是文档正文，而文档正假设层

14、没有嵌套，父级就是文档正文，而文档正文一直是可见的，因此层默许是可见的。文一直是可见的，因此层默许是可见的。7.1.77.1.7更改层的可见性更改层的可见性运用运用“属性面板更改层的可见性。属性面板更改层的可见性。 选中一个或多个层，在选中一个或多个层，在“属性面板中的属性面板中的“可见性可见性选项中进展选择：选项中进展选择：VisibleVisible：无论父级如何设置都显示层的内容；：无论父级如何设置都显示层的内容；Hidden:Hidden:无论父级如何设置都隐藏层的内容；无论父级如何设置都隐藏层的内容；InheritInherit：承继父级层的显示属性，假设父级属性可：承继父级层的显示

15、属性，假设父级属性可见那么显示该层，假设父级层不可见那么隐藏该层。见那么显示该层，假设父级层不可见那么隐藏该层。7.1.87.1.8调整层的大小调整层的大小可以调整单个层的大小，也可以同时调整多个层的可以调整单个层的大小，也可以同时调整多个层的大小以使它们具有一样的宽度和高度。大小以使它们具有一样的宽度和高度。调整单个层的大小调整单个层的大小选中一个层：选中一个层：运用鼠标拖曳运用鼠标拖曳运用键盘挪动：同时按住运用键盘挪动：同时按住和键盘上的方向键，和键盘上的方向键，可调整一个像素的大小。可调整一个像素的大小。运用网格靠齐方式：同时按住运用网格靠齐方式：同时按住和键盘上和键盘上的方向键，可按网

16、格靠齐增量来调整大小。的方向键，可按网格靠齐增量来调整大小。运用修正属性值的方法：在运用修正属性值的方法：在“属性面板中，修正属性面板中，修正“宽宽和和“高。高。7.1.87.1.8调整层的大小调整层的大小同时调整多个层的大小同时调整多个层的大小选择多个层：选择多个层：运用菜单命令：选择运用菜单命令：选择“修正修正 陈列顺序陈列顺序 设成宽度一样或设成宽度一样或高度命令。高度命令。运用快捷键：按运用快捷键：按，以，以当前层为规范同时调整多个层的宽度或高度。当前层为规范同时调整多个层的宽度或高度。运用修正属性值方式：在运用修正属性值方式：在“属性面板中，修正属性面板中，修正“宽和宽和“高。高。7

17、.1.97.1.9嵌套层嵌套层嵌套层指代码包含在另一个层中的层。嵌套通常用于嵌套层指代码包含在另一个层中的层。嵌套通常用于将层组织在一同。将层组织在一同。创建嵌套层创建嵌套层运用菜单命令：将插入点放在现有层中，选择运用菜单命令：将插入点放在现有层中，选择“插入记录插入记录 规划对象规划对象AP DivAP Div命令。命令。运用按钮绘制：拖曳运用按钮绘制：拖曳“插入面板中的插入面板中的“规划选项卡中规划选项卡中的的“绘制绘制AP DivAP Div按钮，将其放置在现有层中。按钮，将其放置在现有层中。修正修正“首选参数：修正首选参数：修正“首选参数对话框中首选参数对话框中“APAP元素元素选项，

18、选择选项，选择“在在AP DivAP Div中创建以后嵌套复选框，单中创建以后嵌套复选框，单击击“绘制绘制AP DivAP Div按钮，然后拖曳鼠标在现有层中绘按钮，然后拖曳鼠标在现有层中绘制一个层。制一个层。7.1.97.1.9嵌套层嵌套层 将现有层嵌套在另一个层中将现有层嵌套在另一个层中 启用启用“APAP元素控制面板元素控制面板 在控制面板中选择一个层，按住在控制面板中选择一个层，按住CtrlCtrl键的同时拖曳鼠标，将其挪动到键的同时拖曳鼠标，将其挪动到“APAP元素控制面板的目的层上，当目的元素控制面板的目的层上，当目的层的称号突出显示时，松开鼠标左键，层的称号突出显示时，松开鼠标左

19、键，即完成嵌套操作。即完成嵌套操作。7.1.97.1.9嵌套层嵌套层层嵌套的本卷须知层嵌套的本卷须知 嵌套层并不意味着一层位于另一层内的显示效嵌套层并不意味着一层位于另一层内的显示效果，嵌套层的本质是一层的果，嵌套层的本质是一层的HTMLHTML代码嵌套与另代码嵌套与另一层的一层的HTMLHTML代码之内。可以用拖曳的方法判别代码之内。可以用拖曳的方法判别两个或多个层能否嵌套，嵌套层随其父级层一两个或多个层能否嵌套，嵌套层随其父级层一同挪动，并且承继其父级层的可见性。同挪动，并且承继其父级层的可见性。7.1.107.1.10挪动层挪动层挪动层的操作非常简单，可以按照在大多数图挪动层的操作非常简

20、单，可以按照在大多数图形运用程序中挪动对象的一样方法在形运用程序中挪动对象的一样方法在“设计视设计视图中挪动层。挪动一个或多个选定层有以下几图中挪动层。挪动一个或多个选定层有以下几种方法。首先要选中要挪动的层：种方法。首先要选中要挪动的层：拖曳选择柄来挪动层拖曳选择柄来挪动层挪动一个像素来挪动层挪动一个像素来挪动层运用方向键，直接以一个像素来挪动层；运用方向键，直接以一个像素来挪动层；按住按住键的同时按方向键，那么按当前网格键的同时按方向键，那么按当前网格靠齐增量来挪动层的位置。靠齐增量来挪动层的位置。7.1.117.1.11对齐层对齐层运用层对齐命令可以当前层的边框为基准对齐一个运用层对齐命

21、令可以当前层的边框为基准对齐一个或多个层。当对选定层进展对齐时，未选定的子层或多个层。当对选定层进展对齐时，未选定的子层能够会由于其父层被选定并挪动而随之挪动。为了能够会由于其父层被选定并挪动而随之挪动。为了防止这种情况，不要运用嵌套层。对齐两个或更多防止这种情况，不要运用嵌套层。对齐两个或更多个层有以下几种方法。个层有以下几种方法。运用菜单命令对齐层运用菜单命令对齐层 在文档窗口中选择多个层，选择在文档窗口中选择多个层，选择“修正修正 陈列顺序陈列顺序命令。命令。运用运用“属性面板对齐层属性面板对齐层 在文档窗口中选择多个层，在属性面板的在文档窗口中选择多个层，在属性面板的“上输入详细值，那

22、么以多个层的上边线相对于页上输入详细值，那么以多个层的上边线相对于页面顶部的位置来对齐。面顶部的位置来对齐。7.1.127.1.12层靠齐到网格层靠齐到网格在挪动网页元素时可以让其自动靠齐到网格，还可在挪动网页元素时可以让其自动靠齐到网格，还可以经过指定网格设置来更改网格或控制靠齐行为。以经过指定网格设置来更改网格或控制靠齐行为。无论网格能否可见，都可以运用靠齐。无论网格能否可见，都可以运用靠齐。运用运用Dreamweaver CS3Dreamweaver CS3中的靠齐功能，层与网格之中的靠齐功能，层与网格之间的关系如铁块与磁铁之间的关系。层与网格线之间的关系如铁块与磁铁之间的关系。层与网格

23、线之间靠齐的间隔是可以设定的。间靠齐的间隔是可以设定的。层靠齐到网格层靠齐到网格查看查看 网格设置网格设置 靠齐到网格靠齐到网格 选择一个层并拖曳它，当拖曳它接近网格线一定间选择一个层并拖曳它，当拖曳它接近网格线一定间隔时，该层会自动跳到最近的靠齐位置。隔时，该层会自动跳到最近的靠齐位置。7.1.127.1.12层靠齐到网格层靠齐到网格更改网格设置更改网格设置查看查看 网格设置网格设置 网格设置网格设置7.27.2运用层设计表格运用层设计表格将将AP DivAP Div转换为表格转换为表格将表格转换为将表格转换为AP DivAP Div由于早期版本的阅读器不能显示运用层规划的网页，由于早期版本

24、的阅读器不能显示运用层规划的网页，为了实现较复杂的效果又需求将早期运用表格规划为了实现较复杂的效果又需求将早期运用表格规划的网页转换成层。的网页转换成层。7.2.17.2.1将将AP DivAP Div转换为表格转换为表格将将AP DivAP Div转换为表格转换为表格 假设将假设将AP DivAP Div转换为表格，那么选择转换为表格，那么选择“修正修正 转换转换 将将AP DivAP Div转换为表格命令，转换为表格命令，弹出弹出“将将AP DivAP Div转换为表格对话框，根据需求转换为表格对话框，根据需求完成设置后，单击完成设置后，单击“确定按钮。确定按钮。7.2.17.2.1将将A

25、P DivAP Div转换为表格转换为表格防止层重叠防止层重叠 由于表单元格不能重叠，所以由于表单元格不能重叠，所以Dreamweaver Dreamweaver CS3CS3无法从重叠层创建表格。假设要将一个文档无法从重叠层创建表格。假设要将一个文档中的层转换为表格以兼容中的层转换为表格以兼容IE 3.0IE 3.0阅读器，那么阅读器，那么选择选择“防止重叠选项来约束层的挪动和定位，防止重叠选项来约束层的挪动和定位，使层不会重叠。使层不会重叠。7.2.27.2.2将表格转换为将表格转换为AP DivAP Div 当不称心页面规划时，就需求对其进展调整，当不称心页面规划时，就需求对其进展调整，

26、但层规划要比表格规划调整起来方便，所以需求将但层规划要比表格规划调整起来方便，所以需求将表格转换为表格转换为AP DivAP Div。 假设将表格转换为假设将表格转换为AP DivAP Div，那么选择，那么选择“修正修正 转换转换 将表格转换为将表格转换为AP DivAP Div命令，弹出命令，弹出“将表格将表格转换为转换为AP DivAP Div对话框，根据需求完成设置后，单对话框，根据需求完成设置后，单击击“确定按钮。确定按钮。不能转换单个表格或层，只能将整个网页的层不能转换单个表格或层，只能将整个网页的层转换为表格或将整个网页的表格转换为层。转换为表格或将整个网页的表格转换为层。将表格

27、转换为将表格转换为AP DivAP Div7.37.3时间轴动画时间轴动画 时间轴也叫时间线，顾名思义，它是一条时间轴也叫时间线，顾名思义，它是一条贯穿时间的线，用来表示网页显示时间内发生贯穿时间的线，用来表示网页显示时间内发生的各种形状，在时间轴上不同时间部位放置不的各种形状，在时间轴上不同时间部位放置不同的内容，就可以实现网页的动态效果。在不同的内容，就可以实现网页的动态效果。在不运用时间轴的情况下，要实现网页中元素的挪运用时间轴的情况下，要实现网页中元素的挪动，需求写出非常复杂的代码。运用时间轴去动，需求写出非常复杂的代码。运用时间轴去实现它们那么非常简单。其主要缘由就在于它实现它们那么

28、非常简单。其主要缘由就在于它是经过向文档中添加是经过向文档中添加JavaScriptJavaScript代码实现动态代码实现动态效果的，不需求其他控件、插件或效果的，不需求其他控件、插件或JavaJava小程序小程序的支持，具有很好的兼容性。的支持，具有很好的兼容性。7.37.3时间轴动画时间轴动画 动画是由一系列静止图像延续播放，利用动画是由一系列静止图像延续播放，利用人类眼睛的人类眼睛的“视觉暂留特性构成的。时间轴视觉暂留特性构成的。时间轴动画是经过让层的位置、可见性和叠加顺序等动画是经过让层的位置、可见性和叠加顺序等属性随时间变化所生成的动画。属性随时间变化所生成的动画。 它的根本原理是

29、：使层中的内容在一定时它的根本原理是：使层中的内容在一定时间内，按照设计好的道路显示在页面中。间内，按照设计好的道路显示在页面中。 时间轴里的层叫做动画栏，时间轴的根本时间轴里的层叫做动画栏，时间轴的根本单位是帧，整个时间轴由许多帧构成，这些帧单位是帧，整个时间轴由许多帧构成，这些帧在页面中延续播放就构成了时间轴动画。在页面中延续播放就构成了时间轴动画。 由时间轴的原理可知，时间轴必需与层结由时间轴的原理可知，时间轴必需与层结合起来运用。创建动画的时候，各种元素先放合起来运用。创建动画的时候，各种元素先放置到层中，然后再结合时间轴创建动态效果。置到层中，然后再结合时间轴创建动态效果。7.37.

30、3时间轴动画时间轴动画课堂案例课堂案例卡通动画网卡通动画网“时间轴面板时间轴面板运用时间轴挪动层运用时间轴挪动层录制层途径录制层途径控制动画播放控制动画播放修正关键帧修正关键帧添加、删除帧添加、删除帧课堂案例课堂案例精品家居网精品家居网用时间轴改动图像与层的属性用时间轴改动图像与层的属性7.37.3时间轴动画时间轴动画课堂案例课堂案例卡通动画网卡通动画网“时间轴面板时间轴面板运用时间轴挪动层运用时间轴挪动层录制层途径录制层途径控制动画播放控制动画播放修正关键帧修正关键帧添加、删除帧添加、删除帧课堂案例课堂案例精品家居网精品家居网用时间轴改动图像与层的属性用时间轴改动图像与层的属性7.3.17.

31、3.1课堂案例课堂案例卡通动画网卡通动画网运用运用“时间轴面板制造层动画效果。运用时间轴面板制造层动画效果。运用“记录记录APAP元素的途径命令制造层沿着绘制元素的途径命令制造层沿着绘制的途径挪动效果。的途径挪动效果。效果图7.3.27.3.2“时间轴面板时间轴面板“时间轴面板用于显示层与图像随时间变时间轴面板用于显示层与图像随时间变化的属性。化的属性。选择选择“窗口窗口 时间轴命令，可以启用时间轴命令，可以启用“时时间轴面板。间轴面板。“时间轴面板时间轴面板7.3.27.3.2“时间轴面板时间轴面板时间轴时间轴下拉列表下拉列表回首帧回首帧后退后退播放一帧，按住不播放一帧，按住不放，可播放动画

32、放，可播放动画当前播放帧当前播放帧时间轴时间轴动画通道动画通道每秒播放帧数每秒播放帧数动画栏动画栏关键帧关键帧行为通道行为通道7.3.37.3.3运用时间轴挪动层运用时间轴挪动层 最常见的时间轴动画都涉及到沿着一条轨最常见的时间轴动画都涉及到沿着一条轨迹挪动层。时间轴只能挪动层，假设要使图像迹挪动层。时间轴只能挪动层，假设要使图像或文本挪动，必需先创建一个层，然后在该层或文本挪动，必需先创建一个层，然后在该层中插入图像、文本或其他任何类型的内容。中插入图像、文本或其他任何类型的内容。7.3.37.3.3运用时间轴挪动层运用时间轴挪动层运用时间轴制造层动画的详细操作步骤如下：运用时间轴制造层动画

33、的详细操作步骤如下：1 1创建一个层，并在层中插入一张图片；创建一个层，并在层中插入一张图片；2 2启动启动“时间轴面板；时间轴面板；3 3选中当前创建的层，将层拖曳到选中当前创建的层，将层拖曳到“时间轴时间轴面板中适当的帧号处；添加对象到面板中适当的帧号处；添加对象到“时间轴时间轴面板面板4 4在在“时间轴面板中拖曳终了关键帧到适时间轴面板中拖曳终了关键帧到适当的帧序号处，以确定动画的播放时间；当的帧序号处，以确定动画的播放时间；5 5选定终了关键帧，在页面中拖曳层到动画选定终了关键帧，在页面中拖曳层到动画的终了位置，文档窗口中显示动画运动的直线的终了位置，文档窗口中显示动画运动的直线途径；

34、途径；6 6假设要制造曲线轨迹的动画，需求在时间假设要制造曲线轨迹的动画，需求在时间轴上添加关键帧；轴上添加关键帧；7 7按住按住“时间轴面板中的时间轴面板中的“播放按钮不放，播放按钮不放，在页面中预览动画效果。在页面中预览动画效果。7.3.37.3.3运用时间轴挪动层运用时间轴挪动层添加对象到添加对象到“时间轴面板的几种方法：时间轴面板的几种方法：将层直接拖曳到将层直接拖曳到“时间轴面板中，然后释放鼠时间轴面板中，然后释放鼠标；标；选中要添加的层，单击选中要添加的层，单击“时间轴面板右上角的时间轴面板右上角的按钮，在弹出的菜单中选择按钮，在弹出的菜单中选择“添加对象命令；添加对象命令；选中要

35、添加的层，选择选中要添加的层，选择“修正修正时间轴时间轴添加对添加对象到时间轴命令；象到时间轴命令；选中要添加的层，在选中要添加的层，在“时间轴面板中单击鼠标时间轴面板中单击鼠标右键，在弹出的菜单栏中选择右键，在弹出的菜单栏中选择“添加对象命令。添加对象命令。前往前往7.3.37.3.3运用时间轴挪动层运用时间轴挪动层关键帧：在动画中可以影响到整个动画效果的关键帧：在动画中可以影响到整个动画效果的帧。帧。如何添加关键帧以制造曲线轨迹的动画：如何添加关键帧以制造曲线轨迹的动画：按住按住的同时在时间轴适当帧序号处单击的同时在时间轴适当帧序号处单击鼠标左键；鼠标左键；在网页中拖曳层到适当的位置，可以

36、看到文档在网页中拖曳层到适当的位置，可以看到文档区中的直线轨迹变成曲线状。区中的直线轨迹变成曲线状。前往前往7.3.47.3.4录制层途径录制层途径假设想制造沿恣意轨迹运动的动画，可以运用假设想制造沿恣意轨迹运动的动画，可以运用“录制层途径录制层途径命令。命令。1 1在文档中插入一个层，并在层中插入一张图片。在文在文档中插入一个层，并在层中插入一张图片。在文档窗口中将层移至动画开场时应处于的位置，并将播放头档窗口中将层移至动画开场时应处于的位置，并将播放头放置在放置在“时间轴面板中适当的帧序号处。时间轴面板中适当的帧序号处。2 2选择选择“修正修正 时间轴时间轴 录制录制APAP元素途径命令。在元素途径命令。在文档中拖曳该层，拖曳的轨迹为层运动的途径