« 上一篇下一篇 »

使用时间轴来制作层网页动画的方法

我们进行网页制作的时候,常常会遇到需要使用时间动画来移动层的问题,一般来说那些最常见的时间轴动画都设计需要沿着一条轨迹来移动层的需要,但是时间轴只能移动层。那么如果我们需要移动图像或者是文本的时候又该怎么做呢?这时候我们只需要使用一下“插入”栏上的“绘制层”按钮来创建一个层,然后再在该层中插入对应的图像、文本或其他任何类型的内容就可以了,并且时间轴还可以更改层和图像的其它属性,那么我们到底该如何使用时间轴来制作层动画呢?

如果要使用时间轴来制作层动画的话,我们首先要做的就是将层移到它在动画开始的时候应在的位置,然后选择“窗口”再选择“时间轴”,接着选择我们需要制作的动画的层,在这个层里面我们需要确保所有的元素都已经选择进去了,然后我们就单击层标记或者是层选择柄,再或者我们可以使“层”面板选择一个层。当这个层选定以后,我们会发现它的周围将出现调整柄,这时候我们在层中单击,就会将一个闪烁的插入点放入层中,但这样不会选定该层。接下来我们也要做的就是选择“修改”再单击“时间轴”然后“在时间轴上添加对象”,或者我们可以直接将选定的层拖至“时间轴”的面板中。这时我们会发现一个条出现在了时间轴的第一个通道中而且层的名称也相应的出现在在该条里面了。

此后我们要做的就是单击位于条末端的关键帧标记。我们会发现将页面上的层逐步移动直到它的终点的时候,页面上相应的会出现一条移动轨迹,它显示的就是我们刚刚设置好的“文档”窗口中动画的运动轨迹。但如果我们希望层可以沿着曲线移动的话,我们还需要按住 Ctrl 键并单击 (Windows) 或者我们可以按住 Command 键并单击 (Macintosh) 动画条中部的一个帧,这样我们可以在单击的帧处添加一个关键帧,或者是单击动画条中部的一个帧再从上下文菜单中选择“添加关键帧”。 然后重复这个步骤,定义其他关键帧就可以了。再这些都弄好以后,我们需要按住“播放”按钮来预览页面上的动画。 再具体设计的时候,我们只需要耐心的重复此过程,我们就可以在时间轴上添加其他的层和图像来创建更为复杂的动画了。

以上就是使用时间轴来制作层动画的方法,方法看起来很简单,但是在实际运用中,需要我们十分细心的一步一步把它完成。

« 上一篇下一篇 »