第 12章 层、时间轴和行为本章要点：
创建层,使用层
创建时间轴动画
层的一些应用
创建行为
基本行为操作
12.1 创建和使用层
12.1.1 层的概念
12.1.2 在网页中创建层
1．插入层
2．创建嵌套层在一个已有的层中，可以插入另一个层，这就是嵌套层。如图 12-1所示就是嵌套层的情况。一般我们称外部的被嵌套层为父层，将层内部的层称作嵌套层，
又叫子层。子层对应的层标记会出现在其父层中。
12.1.3 设置层的属性创建层后，选取该层就在属性面板中打开了层的属性，此时可在属性面板对该层的属性进行设置。如图,
12.1.4 对层的基本操作
1．激活层
2．选取层
3．调整层的大小
4．移动层
5．对齐层
6．改变层的堆叠顺序
7．改变层的可见性
12.1.5 转换表格和层在 Dreamwerver MX中表格和层可以互相转换。可以用层对网页进行布局，然后将层转换为表格，以便在较早的浏览器中进行查看。
1．将层转换为表格
2．将表格转换为层
提示：空白单元格将不会转换为层,除非其中设置了背景颜色 。 表格外的元素也会放置到层中 。
12.2 创建时间轴动画
12.2.1 认识时间轴面板
12.2.2 创建时间轴动画时间轴动画是建立在层基础上，通过改变层的位置、大小等属性来创建的。因此如果要创建图像或文本等对象的动画，则首先必须将这些对象放置在层中，然后通过移动层来移动这些对象，从而达到图像或文本等对象的动画效果。
添加对象后的时间轴
（ 1）添加关键帧
（ 2）删除关键帧
（ 3）改变动画的播放时间
（ 4）改变动画起始时间
（ 5）改变整个动画的位置
（ 6）使用多个时间轴：
（ 7）新建时间轴
（ 8）删除时间轴
12.2.3 修改时间轴
Dreamweaver MX为用户通供了一个录制路径的方法，用于创建复杂路径的动画。具体方法如下：
（ 1）在文档中选中要创建动画的层，将该层拖到动画的起始位置。
（ 2）选择 【 修改 】 → 【 时间轴 】 → 【 录制层路径 】 菜单命令 。
（ 3）在页面中按照需要的路径拖动层。
12.2.4 创建沿路径运动的动画
12.2.5 在时间轴中使用行为
可以在时间轴上绑定行为，当动画执行到某个帧位置时，自动运行该行为对应的动作。有关行为的概念请参考下节中的详细介绍。
将行为绑定到时间轴上的操作步骤如下：
（ 1）打开时间轴面板，添加时间轴动画。
（ 2） 单击时间轴面板的行为通道上要绑定行为的帧位置 。
（ 3） 打开时间轴面板菜单,选择,添加行为,命令,这时会显示行为面板 。
（ 4） 单击行为面板上的加按钮,打开动作菜单,选定某个动作 。
（ 5）绑定行为后，会在行为通道的相应位置出现一个带横杠的浅蓝色方块，它是行为标记。
12.3 行为
12.3.1 行为的概念行为就是在网页中进行的一系列动作，通过这些动作，实现用户与网页的交互，一个行为是由一个事件和一个动作组成。
12.3.2 行为面板和事件
1．行为面板打开方法：选择菜单命令 【 窗口 】 → 【 行为 】 。
提示：如果在事件菜单中没有显示所需要的事件,则必须查看是否绑定了正确的页面元素或显示事件,子菜单中选择正确的浏览器版本 。 软件默认的浏览器版本是,3.0
和更高版本,,一般在第一次使用时,可以选择,IE5.0”
或,IE5.5”。
2．事件前面说过一个行为是由一个动作和一个事件组成，在行为中事件是起因。当访问者与页面进行交互时，浏览器就产生事件。所以有必要了解一些基本的事件类型，以便使用恰当的事件去触发动作，方便访问者与网页的交互。 要注意的是，
不同版本的浏览器所支持的事件类型可能也不相同 。
3．页面中应用行为在网页中应用行为,实际上就是指在网页的某个元素上应用行为 。 网页的整个正文,图像,层,链接等都是页面元素,或称为页面对象 。 因此,要在网页中应用行为时,可以将行为绑定到整个文档 （ <body>标签 ）,链接,图像,表单元素或多种其他 HTML 元素中的任何一种 。
12.4 Dreamweaver MX的内置行为
12.4.1 播放声音
12.4.2 打开浏览器窗口
,打开浏览器窗口,的动作的参数设置对话框如图,
12.4.3 弹出信息
,弹出信息,动作可以弹出一个指定的消息框。在对话框中输入要弹出的内容，如图,
因为消息框只有一个,确定,按钮，所以使用此动作可以提供信息，而不能为用户提供选择。
12.4.4 交换图像和恢复交换图像
提示：使用,交换图像,动作时最好先给页面中的图像命名,然后使用,交换图像,动作 。
12.4.5 设置文本
1,设置状态栏文本
2,设置框架文本
3,设置层文本和设置文本域文本
12.4.6 时间轴
,时间轴,动作有三个子菜单：播放时间轴、停止时间轴、转到时间轴帧 。
12.4.7 拖动层
拖动层动作的参数设置对话框分基本和高级两个部分。
12.4.8 显示－隐藏层
,显示－隐藏层,动作可以在网页中显示、隐藏层，或恢复默认的层可见性。
12.4.9 显示弹出式菜单
,显示弹出式菜单,设置 话框有四个页标签,内容,外观,
高级,位置 。
12.4.10 预先载入图像
提示：对于,交换图像,动作,如果在对话框中选择了
,预先载入图像,选项时,就不需要手动添加预先载入图像 。
12.4.11 转到 URL
提示：如果将框架命名为 top,blank,self 或 parent，
则可能会产生无法预料的结果。浏览器有时会将这些名称误认为保留的目标名称。
12.5 应用实例
【 实例 1】 制作滚动字幕效果。
【 实例 2】 制作幻灯片。
【 实例 3】 制作当网页被打开和关闭时，弹出一个定制小窗口。
12.6 小结
本章主要介绍了层的创建方法、层的属性设置和层的操作。本章的重点是利用时间轴创建动画、修改时间轴、创建沿路径运动的动画及在时间轴中使用行为等，这部分也可以说
Dreamweaver MX中最精彩的部分。本章还介绍了行为的概念、行为面板的使用方法、基本的行为操作和如何使用 Dreamweaver MX自带的行为。最后本章通过几个实例对本章的内容进行了综合，目的是培养读者的动手能力。
创建层,使用层
创建时间轴动画
层的一些应用
创建行为
基本行为操作
12.1 创建和使用层
12.1.1 层的概念
12.1.2 在网页中创建层
1．插入层
2．创建嵌套层在一个已有的层中，可以插入另一个层，这就是嵌套层。如图 12-1所示就是嵌套层的情况。一般我们称外部的被嵌套层为父层，将层内部的层称作嵌套层，
又叫子层。子层对应的层标记会出现在其父层中。
12.1.3 设置层的属性创建层后，选取该层就在属性面板中打开了层的属性，此时可在属性面板对该层的属性进行设置。如图,
12.1.4 对层的基本操作
1．激活层
2．选取层
3．调整层的大小
4．移动层
5．对齐层
6．改变层的堆叠顺序
7．改变层的可见性
12.1.5 转换表格和层在 Dreamwerver MX中表格和层可以互相转换。可以用层对网页进行布局，然后将层转换为表格，以便在较早的浏览器中进行查看。
1．将层转换为表格
2．将表格转换为层
提示：空白单元格将不会转换为层,除非其中设置了背景颜色 。 表格外的元素也会放置到层中 。
12.2 创建时间轴动画
12.2.1 认识时间轴面板
12.2.2 创建时间轴动画时间轴动画是建立在层基础上，通过改变层的位置、大小等属性来创建的。因此如果要创建图像或文本等对象的动画，则首先必须将这些对象放置在层中，然后通过移动层来移动这些对象，从而达到图像或文本等对象的动画效果。
添加对象后的时间轴
（ 1）添加关键帧
（ 2）删除关键帧
（ 3）改变动画的播放时间
（ 4）改变动画起始时间
（ 5）改变整个动画的位置
（ 6）使用多个时间轴：
（ 7）新建时间轴
（ 8）删除时间轴
12.2.3 修改时间轴
Dreamweaver MX为用户通供了一个录制路径的方法，用于创建复杂路径的动画。具体方法如下：
（ 1）在文档中选中要创建动画的层，将该层拖到动画的起始位置。
（ 2）选择 【 修改 】 → 【 时间轴 】 → 【 录制层路径 】 菜单命令 。
（ 3）在页面中按照需要的路径拖动层。
12.2.4 创建沿路径运动的动画
12.2.5 在时间轴中使用行为
可以在时间轴上绑定行为，当动画执行到某个帧位置时，自动运行该行为对应的动作。有关行为的概念请参考下节中的详细介绍。
将行为绑定到时间轴上的操作步骤如下：
（ 1）打开时间轴面板，添加时间轴动画。
（ 2） 单击时间轴面板的行为通道上要绑定行为的帧位置 。
（ 3） 打开时间轴面板菜单,选择,添加行为,命令,这时会显示行为面板 。
（ 4） 单击行为面板上的加按钮,打开动作菜单,选定某个动作 。
（ 5）绑定行为后，会在行为通道的相应位置出现一个带横杠的浅蓝色方块，它是行为标记。
12.3 行为
12.3.1 行为的概念行为就是在网页中进行的一系列动作，通过这些动作，实现用户与网页的交互，一个行为是由一个事件和一个动作组成。
12.3.2 行为面板和事件
1．行为面板打开方法：选择菜单命令 【 窗口 】 → 【 行为 】 。
提示：如果在事件菜单中没有显示所需要的事件,则必须查看是否绑定了正确的页面元素或显示事件,子菜单中选择正确的浏览器版本 。 软件默认的浏览器版本是,3.0
和更高版本,,一般在第一次使用时,可以选择,IE5.0”
或,IE5.5”。
2．事件前面说过一个行为是由一个动作和一个事件组成，在行为中事件是起因。当访问者与页面进行交互时，浏览器就产生事件。所以有必要了解一些基本的事件类型，以便使用恰当的事件去触发动作，方便访问者与网页的交互。 要注意的是，
不同版本的浏览器所支持的事件类型可能也不相同 。
3．页面中应用行为在网页中应用行为,实际上就是指在网页的某个元素上应用行为 。 网页的整个正文,图像,层,链接等都是页面元素,或称为页面对象 。 因此,要在网页中应用行为时,可以将行为绑定到整个文档 （ <body>标签 ）,链接,图像,表单元素或多种其他 HTML 元素中的任何一种 。
12.4 Dreamweaver MX的内置行为
12.4.1 播放声音
12.4.2 打开浏览器窗口
,打开浏览器窗口,的动作的参数设置对话框如图,
12.4.3 弹出信息
,弹出信息,动作可以弹出一个指定的消息框。在对话框中输入要弹出的内容，如图,
因为消息框只有一个,确定,按钮，所以使用此动作可以提供信息，而不能为用户提供选择。
12.4.4 交换图像和恢复交换图像
提示：使用,交换图像,动作时最好先给页面中的图像命名,然后使用,交换图像,动作 。
12.4.5 设置文本
1,设置状态栏文本
2,设置框架文本
3,设置层文本和设置文本域文本
12.4.6 时间轴
,时间轴,动作有三个子菜单：播放时间轴、停止时间轴、转到时间轴帧 。
12.4.7 拖动层
拖动层动作的参数设置对话框分基本和高级两个部分。
12.4.8 显示－隐藏层
,显示－隐藏层,动作可以在网页中显示、隐藏层，或恢复默认的层可见性。
12.4.9 显示弹出式菜单
,显示弹出式菜单,设置 话框有四个页标签,内容,外观,
高级,位置 。
12.4.10 预先载入图像
提示：对于,交换图像,动作,如果在对话框中选择了
,预先载入图像,选项时,就不需要手动添加预先载入图像 。
12.4.11 转到 URL
提示：如果将框架命名为 top,blank,self 或 parent，
则可能会产生无法预料的结果。浏览器有时会将这些名称误认为保留的目标名称。
12.5 应用实例
【 实例 1】 制作滚动字幕效果。
【 实例 2】 制作幻灯片。
【 实例 3】 制作当网页被打开和关闭时，弹出一个定制小窗口。
12.6 小结
本章主要介绍了层的创建方法、层的属性设置和层的操作。本章的重点是利用时间轴创建动画、修改时间轴、创建沿路径运动的动画及在时间轴中使用行为等，这部分也可以说
Dreamweaver MX中最精彩的部分。本章还介绍了行为的概念、行为面板的使用方法、基本的行为操作和如何使用 Dreamweaver MX自带的行为。最后本章通过几个实例对本章的内容进行了综合，目的是培养读者的动手能力。
