如何用Adobe Edge做一個(gè)最簡(jiǎn)單的HTML5動(dòng)畫

1、如何用adobe edge做一個(gè)最簡(jiǎn)單的html5動(dòng)畫1、首先在位置，用鼠標(biāo)右擊。點(diǎn)擊新建合成組。2、在彈出的面板中，設(shè)置下面的持續(xù)時(shí)光為三秒，點(diǎn)擊確定。3、然后在下面的面板中，鼠標(biāo)右擊，點(diǎn)擊新建，挑選固態(tài)層。4、在彈出的固態(tài)層設(shè)置中，設(shè)置寬高為200px,挑選色彩為黃色，點(diǎn)擊確定。5、下面我們已經(jīng)建了一個(gè)固態(tài)層，點(diǎn)擊鍵盤上的p鍵，調(diào)出位置功能。6、點(diǎn)擊位置前面的秒表。7、然后拖動(dòng)時(shí)光軸，在拖動(dòng)上面的黃色方塊。8、這樣一個(gè)容易的動(dòng)畫就做好了，點(diǎn)擊右上角預(yù)覽控制臺(tái)中的播放按鈕，就可以看見一個(gè)運(yùn)動(dòng)的黃色方塊了。以下就以做一個(gè)最容易的方塊動(dòng)畫來解釋基本使用：1. 用法方塊工具在stage上畫一個(gè)方塊

2、， 順便將前景色選為藍(lán)色2. 我們目標(biāo)是讓方塊移動(dòng)到右下角， 在移動(dòng)過程中轉(zhuǎn)變它的透亮度 和 旋轉(zhuǎn)角度所以我們先要對(duì)這幾個(gè)參數(shù)建立關(guān)鍵幀右擊方塊， 在彈出菜單中挑選 add keyframe - opacity3. 然后我們?cè)谙路降膖imeline面板中將初始的透亮度修改為204. 然后我們將右邊的時(shí)光浮標(biāo)拖動(dòng)到一個(gè)任意的時(shí)光點(diǎn)， 點(diǎn)擊透亮度修改框右邊的小按鈕， 再次創(chuàng)建一個(gè)關(guān)鍵幀5. 創(chuàng)建完其次個(gè)關(guān)鍵幀后， 我們?cè)賹?duì)透亮度舉行修改， 改為100此時(shí)能夠發(fā)覺在兩個(gè)時(shí)光點(diǎn)的關(guān)鍵幀挺直浮現(xiàn)了淡黃色填充條， 代表這里已經(jīng)存在一個(gè)變幻的過程了， 我們此時(shí)可以點(diǎn)擊play按鈕試一下6. 如法炮制， 我們

3、可以再添加一個(gè)旋轉(zhuǎn)的動(dòng)畫， 只要右擊挑選add keyframe- rotate （或者挺直在左邊修改rotate值也可以）注重一定要保證你運(yùn)行動(dòng)畫的兩端時(shí)光點(diǎn)都有關(guān)鍵幀， 關(guān)鍵幀通過點(diǎn)擊屬性修改框右邊的菱形按鈕添加7. 此時(shí)應(yīng)當(dāng)可以運(yùn)行2個(gè)動(dòng)畫了， 按play鍵試試唄——接下來我們可以對(duì)這個(gè)矩形再添加一個(gè)容易的大事， 比如鼠標(biāo)單擊時(shí)使動(dòng)畫回放我們需要在右上角的elements菜單中找到rectangle, 點(diǎn)擊左邊的open actions添加大事處理程序8. 挑選click大事9. 在代碼編輯框中挑選右邊的play reverse選項(xiàng)添加回放的功能。 （固然你也可以自己編寫自己的代碼）10. 編輯完畢后挺直關(guān)閉即可， 因?yàn)樵诰庉嫶翱谥袩o法挺直響應(yīng)點(diǎn)擊大事， 我們需要保存為html文件在掃瞄器中舉行實(shí)驗(yàn)點(diǎn)擊左上角file-save as 保存為html文件11. 我們可以發(fā)覺它生成了好多js文件其中edge_includes文件夾中存放了jquery庫的文件以及edge的共用js庫文件其余js文件則是當(dāng)前頁面所需要的js文件12. 挺直