為開(kāi)發(fā)者準(zhǔn)備的15個(gè)最棒的JavaScript動(dòng)畫(huà)庫(kù)
jQuery給各種效果帶來(lái)了無(wú)限的可能性,他有著簡(jiǎn)單的、啟發(fā)性的API,你可以利用它創(chuàng)建你能想到的、甚至你想象不到的效果(有賴于你的創(chuàng)造力和想象力)。
富有創(chuàng)造力的jQuery使用可以為網(wǎng)頁(yè)設(shè)計(jì)帶來(lái)豐富的動(dòng)畫(huà)效果,增強(qiáng)用戶的視覺(jué)體驗(yàn)——顯然,繼續(xù)創(chuàng)建吸引人的網(wǎng)頁(yè)特效可以為你創(chuàng)造更多的回頭客,這些魔幻般的效果在以往只能用Flash實(shí)現(xiàn)。
這一次,我們想向你介紹一些jQuery動(dòng)畫(huà)方面的創(chuàng)新使用,讓你的工程、網(wǎng)站和應(yīng)用收益。
祝你愉快!
1. Tween JS
TweenJS 是一個(gè)簡(jiǎn)單的 Javascript 補(bǔ)間動(dòng)畫(huà)庫(kù)。開(kāi)發(fā)初衷是可以很好的集成 EaselJS 庫(kù),但又不依賴于或者限定于它。它支持根據(jù)數(shù)值對(duì)象的屬性和 CSS 樣式的屬性進(jìn)行補(bǔ)間動(dòng)畫(huà)。API 簡(jiǎn)單而強(qiáng)大,可以很容易的通過(guò)鏈接命令構(gòu)造復(fù)雜的補(bǔ)間動(dòng)畫(huà)。
2. Jsanim
jsAnim 是為網(wǎng)站所用的動(dòng)畫(huà)庫(kù),效果平庸,實(shí)現(xiàn)笨拙粗劣,犧牲了標(biāo)準(zhǔn)與親和力,大小以至于達(dá)到龐大的 25k 字節(jié)。
3. Animo.js
Animo.js 是個(gè)小巧但強(qiáng)大的管理 CSS 動(dòng)畫(huà)的工具。它的特點(diǎn)有:疊加動(dòng)畫(huà),創(chuàng)建跨瀏覽器的模糊效果,動(dòng)畫(huà)完成后可執(zhí)行回調(diào)函數(shù)。
4. Move.js
Move.js 是一個(gè)小巧的JavaScript庫(kù),能使利用CSS3支持的動(dòng)畫(huà)變得非常簡(jiǎn)單和優(yōu)雅。
5. Collie
Collie 是一個(gè)有助于使用 HTML5 創(chuàng)造高度優(yōu)化的動(dòng)畫(huà)和游戲的JavaScript庫(kù)。它可以運(yùn)行在能夠使用HTML5畫(huà)布和DOM的PC和手機(jī)上。它可以穩(wěn)定地處理使用渲染管線的多個(gè)對(duì) 象,支持包括精靈動(dòng)畫(huà)和用戶事件等的有用功能。能夠穩(wěn)定支持iOS和Android,并為每個(gè)平臺(tái)以優(yōu)化的方法呈現(xiàn)。也很容易對(duì)視網(wǎng)膜顯示器提供反應(yīng)。
#p#
6. Minified.js
Minified.js是一個(gè)體積小(<8kB)功能強(qiáng)的客戶端JavaScript庫(kù)。它提供了類似于jQuery的功能(DOM操作、動(dòng)畫(huà)、時(shí)間、HTTP請(qǐng)求) 和其他功能(集合、日期&數(shù)字格式化、日期計(jì)算、模板),并有著簡(jiǎn)單明了的API。
7. Rekapi
Rekapi是一款JavaScript關(guān)鍵幀動(dòng)畫(huà)庫(kù)。它提供了一套API讓你可以定義關(guān)鍵幀動(dòng)畫(huà)并控制動(dòng)畫(huà)播放。Rekapi并未指定渲染行為。 事實(shí)上,Rekapi的內(nèi)核并為執(zhí)行任何渲染操作。它提供了一個(gè)API來(lái)定義渲染器,標(biāo)準(zhǔn)的發(fā)行包包括HTML DOM和HTML5 2D Canvas渲染器模塊。
8. Snap.svg
SVG是建立互動(dòng)的一個(gè)很好的方式,獨(dú)立于分辨率的矢量圖形會(huì)在任何屏幕看起來(lái)都很棒。Snap.svg 這個(gè)JavaScript庫(kù),使你的SVG資源使用起來(lái)就象用jQuery操作DOM一樣容易。Snap.svg專為現(xiàn)代瀏覽器設(shè)計(jì),因此支持***的 SVG特性,如遮蔽,裁剪,模式,完整的梯度,分組,和更多。
9. Favico
想給你的網(wǎng)站圖標(biāo) favicon 添加徽章、圖片,甚至是視頻嗎? Favico.js可以簡(jiǎn)單地為你的 favicon 圖標(biāo)添加動(dòng)畫(huà)的徽章,或從一個(gè)圖像(視頻,甚至是從你的網(wǎng)站的訪問(wèn)者的網(wǎng)絡(luò)攝像頭)飛快地創(chuàng)建 favicon。
10. Textillate.js
Textillate.js 是一個(gè)針對(duì) CSS3 文本動(dòng)畫(huà)的簡(jiǎn)單插件。它融合了一些很棒的庫(kù),成為一個(gè)易用的對(duì)任意文本應(yīng)用CSS3動(dòng)畫(huà)的插件。
#p#
11. Firmin
Firmin 是一個(gè) JavaScript 動(dòng)畫(huà)庫(kù),它使用 CSS 的轉(zhuǎn)換和過(guò)渡功能來(lái)創(chuàng)造光滑的、帶有硬件加速的動(dòng)畫(huà)的
12. AliceJS
AliceJS – (一個(gè)輕量級(jí)的獨(dú)立CSS引擎)是一個(gè)微型的JavaScript庫(kù),集中在使用硬件加速的能力(特別是CSS3特性)在現(xiàn)代瀏覽器中生成高端大氣上檔次的視覺(jué)效果。
13. SVG.js
SVG.js 是一個(gè)輕量級(jí)SVG動(dòng)畫(huà)和操作Javascript庫(kù). 它有簡(jiǎn)單整潔的語(yǔ)法,壓縮后只有7K的大小,并且它有豐富的有用的插件,等等。
14. Motio
Motio 是一個(gè)輕量的用于制作簡(jiǎn)單但功能強(qiáng)大的基于動(dòng)畫(huà)和平移畫(huà)面的Javascript庫(kù),它獲取一個(gè)元素,然后改變背景的位置來(lái)創(chuàng)建動(dòng)畫(huà)效果。Motio 不依賴于任何插件,但是有一個(gè)可選的Motion JQuery插件。
Motio
15. Anima.js
Anima.js 可以簡(jiǎn)化在同一時(shí)刻使得成百上千的元素具有動(dòng)畫(huà)效果的工作. 并且可以更好的控制你的動(dòng)畫(huà), 甚至可以只創(chuàng)建CSS動(dòng)畫(huà) (盡管這只提供少量的控制器,并且這一特性目前還處于實(shí)驗(yàn)階段).
原文鏈接:http://codegeekz.com/15-best-javascript-animation-libraries-for-developers/
譯文鏈接:http://www.oschina.net/translate/15-best-javascript-animation-libraries-for-developers