# 制作接力型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