Timeline是用来设置在特定的时间实现特定的效果。 使用Timeline,可在某时间用一个图像替换掉一个已存在的图像,也可在某时间改变层的位置、大小、可视性和Z值,还可在某时间调用Behavior的动作。
点击菜单栏的Window\Timeline,或直接使用快捷键Ctrl+F9,即弹出如图的Timeline面板。
(Timeline面板) Timeline用了帧这个这个概念。从一秒中抽出若干时间点,每个时间点的效果就叫 一帧。
在Fps后面填入一个数值,表示把一秒分成多少帧。一般使用15即可。
选中Autoplay前的选框,会弹出一个对话框,点击OK即可。这是设置页面一打开即自动播放这个Timeline。实际上,Autoplay是设置用Behavior的onLoad事件调用Paly Timeline动作。
选中Loop按钮,会弹出一个对话框,点击OK即可。这是设置这个Timeline循环播放。实际上,Loop是设置在Timeline最后一帧调用Paly Timeline动作。
面板下面部分可分为三个部分。中间有1、5等数字的尺状部分是帧标尺。用来描述帧数。 帧标尺上面的部分是添加Behavior的部分,将把添加的Behavior显示在这里。 帧标尺下面的部分是添加图像或层的部分,将把添加的图像和层显示在这里。
对层或图象使用Timeline,要将图象或Timeline拖入这个Timeline。
下面是一个Timeline使用的实例。
这个例子是层与Timeline配合使用,要求达到的效果是一辆车从页面左边开到右边,当开到右边时,出现文本“Danger!”。
这需要用到两个层。第一个层里加入含有车的图像。这个层在Timeline播放第一帧时,位于页面左方;在Timeline播放最后一帧时,这个层改变位置到页面右边。第二个层里加入文本“Danger!”。这个层一直设为不可视,在Timeline播放到最后一帧时,可视性改为可视。
先在Dreamweaver主窗口左方画一个层,往这个层中加入一个含有车的图像。点击这个层的边框,选中这个层。在层的Properties面板上的Layer ID下面填入给这个层的命名。这里,我们将它命名为a。 然后在Dreamweaver主窗口右方画一个层,往这个层中写入文本“Danger!”,设置好这个文本的大小、颜色等各种属性。 点击这个层的边框,选中这个层。在层的Properties面板上的Layer ID下面填入给这个层的命名。这里,我们将它命名为b。 点击菜单栏的Window\Timeline,或使用快捷键Ctrl+F9,打开Timeline面板。 将层a和层b都拖入Timeline面板,如下图所示。这时,面板上多出a和b两项。
(对例子中Timeline第一帧的设置) 点击层b的边框,选中层b。
在层b的Properties面板上,选择Vis后下拉选框的hidden选项。这样,层b的可视性被设为不可视。
Timeline开始的第一帧设置完毕。 点击Timeline面板帧标尺上数字15的位置,即可对Timeline最后一帧进行设置。
点击Timeline面板上b这一项,这时本来不可视的层b在Dreamweaver主窗口上被显示出来。在层b的Properties面板上,选择Vis后下拉选框的visible选项。层b的可视性被改为可视。
在Dreamweaver主窗口上拖动层a至窗口右方。层b的位置被从页面左边改变到右边。
这时的设置可见下图所示。
(对例子中Timeline最后一帧的设置)
为了让这个Timeline在页面一打开就能播放,应选中Autoplay前的选框。如果想让这个Timeline循环播放,选中Loop前的选框即可。
至此,设置完毕,达到了例子的要求。
Dreamweaver对制作动态的层效果提供了强大的支持。只要你能想到的,就能用Dreamweaver做出来。剩下的事情,就是好好的发挥你的想象力。