# 制作接力型H5 **制作首页** 新建图层，分别将首页图片和文字素材添加进舞台，调整位置大小等。同时在时间轴上插入关键帧动画，为各个素材制作动画效果。  如下图，将“历史”文字图片转化为元件，在元件页面通过遮罩功能制作一个“历史”文字的动态效果。  最后为其他文字等素材添加预置动画等，设置出现时间和动画效果。  **制作擦玻璃过渡动画** 添加背景图片、“擦一擦”“宛平城”等素材，调整位置大小，同时为素材制作相对应的动画效果等。  新建图层，在最后帧数上插入关键帧，添加一个“擦玻璃”功能，设置其背景图片和前景图片，同时可设置其橡皮擦大小、剩余比例等属性。  新建图层，在“擦玻璃”后一帧插入关键帧，再添加“擦玻璃”背景图片，调整大小位置，使其与“擦玻璃”背景图片大小位置重合。同时为该图层插入关键帧动画设置移动的动画效果。  新建图层，在“擦玻璃”关键帧相同帧数上添加一个“出现即暂停”的行为物体（注意在该帧数后面一帧插入一个空白帧）。  为“擦玻璃”添加一个“擦玻璃完成即播放下一帧”的行为。  新建图层，在“擦玻璃”下一帧插入文字，“插入进度动画”，设置文字以打字机效果出现的动画。  **制作视频页** 导入视频至舞台，可为视频添加背景图片、设置视频大小位置以及其他播放属性。  如下图，新建图层，在时间轴合适的位置插入关键帧，插入一个“出现即暂停”行为物体（注意在后面一帧插入一个空白帧）。  新建图层，在“出现即暂停”帧数后一帧插入关键帧，插入相关文字，为文字“插入进度动画”，设置文字以打字机效果出现的动画。为文字所在的帧命名为“go”。  为视频添加“视频结束跳转到‘go’帧并播放”的行为。  **制作献花接力效果** 添加相关素材，调整素材的大小位置等，注意为文本框命名为“献花数量”。  新建图层“计数器”，添加一个“计数器”在舞台上，设置默认值为“0”，计数值为“1”，并且为其命名为“计数器1”。  为按钮添加行为 数据服务→设置计数器→触发条件：点击→设置参数 计数器名称：“计数器1” 显示计数元素：“献花数量”   如图，如何制作“点击按钮，花即从按钮中随机移至上面五朵花中任意一朵位置”的动画效果？  如下图，制作一个花的元件，设置“从按钮位置旋转移至舞台上面第一朵花的位置上”的动画效果。为元件命名为“花1”。  同理再设置一个元件，该元件的花最后停留在舞台上面第二朵花的位置上，为其命名“花2”，将其添加进舞台（此处仅供理解，不再多添加其它三个元件）。 在舞台之外添加一个随机数，设置相关属性，例如最大值为“2”，最小值为“1”，更新间隔“0.1”。  为按钮添加两个行为 动画播放控制→播放元件片段→触发条件：点击→设置参数 元件实例名称：“花1” 是否循环：“不循环” 起始帧号：“2” 结束帧号：“20” 执行条件：检查元素状态→随机数1→文本或取值→等于→1 同理设置跳转“花2”播放的行为。   设置画面出现即显示原始数值：新建图层，添加一个文本框，为其添加“出现即将计数器数值显示到‘献花数量’文本框中”的行为。  **设置留言** 我们先新建图层，在合适的帧数上添加一个“出现即暂停”的行为物体，将舞台动画停在一帧。 在“暂停”帧数的后一帧添加“我要留言”按钮素材，同时再在下一帧制作“留言页面”，在留言区域添加输入框，为其命名为“文本输入1”。  如下图，为“提交”按钮添加“提交‘文本输入1’表单”行为，提交成功或失败后都跳转舞台画面（上一帧）。   同时也可设置点击黑色其他区域也可跳转返回舞台画面（上一帧）的行为。  为舞台的“我要留言”按钮添加“点击跳转下一帧”行为。  最后，我们可在后台查找相关提交的数据。  观看本节视频教程： http://cdn1.mugeda.com/course/4/4.3/4.3.12.mp4