第6讲层和时间轴.doc

第6讲层和时间轴 层 层是一种网页元素定位技术，通过层可以以像素为单位精确定位网页元素。层可以放置在网页上的任意位置。可以在层设置文本、图像等元素甚至其它层。把页面元素放入层中，可以控制元素的显示顺序，也能控制是那个显示，那个隐藏。配合时间轴的使用，还可以同时移动一个或多个层，这样可以轻松制作出动态效果。 1）创建层 “查看”-“可视化助理”-“不可见元素”保证不可见元素在页面上可见。 选择“插入栏常用”选项下的“描绘层”，然后直接在画面上绘制层 2）显示层面板 “窗口”－“其它”－“层”把层面板选择出来 在这里可以选择显示或隐藏层 最左边的“眼睛”选项里，单击该地方可以改变改层是显示还是隐藏 如果层名称前面的眼睛是睁开的话，表示显示该层； 如果眼睛是闭上的话，表示隐藏改层； 如果前面什么都没有的话，则该层的可见性继承其父层的显示属性（默认）。（继承可以这样理解：继承就是一般默认是显示的；但是如果层里面有嵌套层时，嵌套层的显示属性默认的话跟它的“父层”一致） 名称选项双击的话可以改名 Z：层的层次属性值，数值越大越在上层。单击可以修改层次。也可以选定一个层，把层直接拖到想要的层次也可以。 左边的layer2层拖到最到最上面后如上图 3）选择层和激活层 选择层：要对层进行移动，调整大小等就要先选择层 要选择层的话，可以在层面板里面选择，或点击层边框，或点击层标记等 选中后如左图，可以直接移动或调整层的大小了。 选择多个时，shift键。 激活层：要把对象插入层中，首先要激活层。 把光标移动到层内的任何地方单击，如左图。就可以在里面插入文本，图像等对象了 注意：激活层不等于选择层 设置层属性 先选择层，然后可以设置属性。下面简单说一下几个特别的参数属性 ①左、上：设定层相对与页面或父层的位置（坐标） ②Z轴：设置层的层次属性值 ③显示：设置层的可见性，default指不指明可见性，但一般default是“继承”。（继承意思看层面板那里） ④溢出：层内容超出层范围（层尺寸）时的处理方法。Visible（可见）：自动增加层的尺寸；hidden（隐藏）：保持层尺寸不变，隐藏超出部分内容；scroll：无论是否超出范围，显示滚动条；auto： 当层内容超出层范围时，自动增加滚动条，默认值。 ⑤剪辑：设置层的可视区域。其中的数值表示可视区域与层边界的像素值 5)对齐层 多层时要选择对齐层。先用shift键把多层选定，然后“修改”－“对齐”选择对齐方式 时间轴 通过在不同时间改变层的位置、大小、可见性和叠放顺序来创建动画。 “窗口”－“其它”－“时间轴”把时间轴面板选择出来 4为时间轴下拉列表：选择当前时间轴 5为行为通道：显示时间轴对应时间所附近的行为，使用浅蓝色方块来表示存在的行为 6为动画播放头：表示当前的动画播放位置。播放头显示在帧数行上，颜色是红色 7为动画通道：显示层和图像的动画条 8为动画条：显示每一个动画的持续时间。在一个动画通道行上可以包含多个动画条，用于表示多个不同的动画对象。不同的动画条在同一帧内不能控制相同的对象 9为关键帧：为对象指定某一确定时刻上的状态。在DW中，系统自动根据两个关键帧的位置计算对象在其间发生的动作。 1为时间轴 2为播放头所在帧 3为帧频率：设置动画播放时间，单位为帧每秒 直接创建时间轴动画：时间轴只能移动层 绘制一个层，在里面插入内容 把层选定 注意：由于时间轴只能移动层，所以是把层选择，具体这里不要把图像给选定了 3）把选定的层直接拖进时间轴，这是可以看到时间轴里面有了一段动画条了； 或者在选定好层之后，右键单击时间轴面板，选择“添加对象“把选定的层添加进去 加进去后，可以看到紫色的动画条了。其中有两个帧有圆点，表明是关键帧。可以直接拖懂动画条到某一位置，也可以拖懂关键帧改变动画条的长度。这里把动画条移动合适位置。 5）选定起始关键帧，把层拖到起始位置 6）选定最好关键帧，把层移动到终点位置。这是可以看到动画起始位置和结束位置有一线条显示，这是层的运动轨迹，如果没有这一线条显示说明没有创建成功。 7）时间轴的“自动播放”要选上，“循环”选项看情况选择 8)如果说是层按曲线移动，或者说只有首尾状态，太单调了，可以适当地添加关键帧，然后改变关键帧的状态即可。 右键单击动画条，选择“添加关键帧” 9）可以看到中间就有了关键帧了 10）选定刚添加的关键帧，移动层的位置。这样动画就完成了 2）拖动路径创建动画 如果要创建复杂路径的动画，按上例步骤一个个关键帧的方法比较麻烦，可以拖动层时记录路径的方法来创建动画。 1)选定一个层，并把层移动到起始位置处。并保持层被选中 2）右键单击时间轴，选择“录制层路径” 拖动层。这是