《原生 JS 實現幀動畫庫》是慕課網提供的慕課課程，授課老師是ustbhuangyi。
基本介紹
- 中文名：原生 JS 實現幀動畫庫
- 授課老師：ustbhuangyi
- 提供方：慕課網
- 類別：慕課
課程簡介,課程大綱,
課程簡介
網頁中各種酷炫的幀動畫一定會吸引你的注意，難道你不想了解背後的實現原理嗎。本課程首先介紹了常見的幾種幀動畫方案以及JS實現幀動畫的原理，接下來介紹如何設計一個通用的幀動畫解決方案，最後帶大家一起實現一個 JS 幀動畫庫。
課程大綱
第1章 認識幀動畫
本章節講解什麼是幀動畫，常見幾種幀動畫實現方式及對比，JS實現幀動畫原理和簡單的幀動畫實現。然後從需求分析，編程接口，調用方式和代碼設計四個方面去介紹如何去設計一個通用的幀動畫庫。
1-1 認識幀動畫 (18:53)
1-2 設計通用幀動畫庫 (12:53)
第2章 設計幀動畫庫
本章節從需求分析，編程接口，調用方式和代碼設計四個方面去介紹如何去設計一個通用的幀動畫庫。
2-1 接口定義 (12:50)
2-2 圖片預載入實現 (26:16)
2-3 圖片預載入的套用 (06:35)
2-4 從入口函式開始 (11:33)
2-5 timeline的實現 (22:47)
2-6 剩餘接口實現(上) (12:25)
2-7 剩餘接口實現(下) (13:56)
第3章 webpack打包及幀動畫庫演示
這章節講解webpack打包等等知識點，滿滿的乾貨，然後會通過編寫demo，演示了幀動畫庫的鏈式用法，對各個接口做了測試，也編寫了一個較為複雜的動畫，都可以通過幀動畫庫完美實現。
3-1 webpack打包和demo編寫 (12:35)
3-2 demo的完整實現 (25:13)
3-3 課程總結 (02:27)
