-
編程接口查看全部
-
設(shè)計一個通用的幀動畫庫查看全部
-
JS實現(xiàn)幀動畫的原理查看全部
-
GIF和CSS3 animation實現(xiàn)幀動畫的不足查看全部
-
重要點在課程的代碼查看全部
-
編程接口3查看全部
-
編程接口2查看全部
-
編程接口1查看全部
-
js動畫查看全部
-
原生JS實現(xiàn)幀動畫庫 設(shè)計一個通用的動畫庫（需求分析） 1. 支持圖片預加載 2. 支持兩種動畫播放方式，及自定義每幀動畫 3. 支持單組動畫控制循環(huán)次數(shù)（可支持無限次） 4. 支持一組動畫完成，進行下一組動畫 5. 支持每個動畫完成后有等待時間 6. 支持動畫暫停和繼續(xù)播放 7. 支持動畫完成后執(zhí)行回調(diào)函數(shù) 編程接口 1. loadImage(imagelist) //預加載圖片 2. changePosition(ele, positions, imageUrl) //通過改變元素的background-position實現(xiàn)動畫 3. changeSrc(ele, imglist) //通過改變image元素的src 4. enterFrame(callback) //每一幀動畫執(zhí)行的函數(shù)，相當于用戶可以自定義每一幀動畫的callback 5. repeat(times) //動畫重復執(zhí)行的次數(shù)，times為空時表示無限次 6. repeatForever() //無限重復上一次動畫，相當于repeat()，更友好的一個借口吧 7. wait(time) //每個動畫執(zhí)行完后等待的時間 8. then(callback) //動畫執(zhí)行完成后的回調(diào)函數(shù) 9. start(interval) //動畫開始執(zhí)行，interval表示動畫執(zhí)行的間隔 10. pause() //動畫暫停 11. restart() //動畫從上一次暫停處重新執(zhí)行 12. dispose() //釋放資源 調(diào)用方式： 1.支持鏈式調(diào)用，我們期望動詞的方式描述接口 var animation = require('animation'); var demoAnimation = animation().loadImage(images).changePosition(ele, positions) .repeat(2).then(function () { //動畫執(zhí)行完成后調(diào)用此函數(shù) }); demoAnimation.start(80);查看全部
-
JS實現(xiàn)幀動畫原理查看全部
-
為什么要用JAVASCRIPT幀動畫查看全部
-
第一種方式是請求了多張圖片，相當于多個HTTP請求 第二種方式只是請求了一張圖片，只有一次HTTP請求查看全部
-
JS實現(xiàn)幀動畫的原理查看全部
-
assault查看全部
舉報
0/150
提交
取消