神坑記錄：

?1、transform: translate3d(80%,0,0); 無法作為參數，必須修改為這種：translateX: 0%

?

官方文檔

http://velocityjs.org/

github地址

https://github.com/julianshapiro/velocity

npm下載安裝

npm install velocity-animate --save-dev

調試地址

http://codepen.io/julianshapiro/full/oHaCy/

?

坑點和注意點：

理論來說，JS對于操作CSS的權限應該是最大的。但是經過實踐。我發現?Velocity 中指定的?duration 屬性權限是最小的。即渲染的時候，優先計算順序為：style->css->duration?

也就是說，如果對象想正常使用Velocity 的?duration 屬性，必須確保對象的css中沒有綁定任何css3的trantions

?

基本使用

#el 為 dom對象 Velocity(el,{translateX: "80%"},0);#神坑：transform: translate3d(80%,0,0); 無法作為參數，必須修改為這種：translateX: 0% Velocity(el,{translateX: "0%"},250,"ease");

?

總結

以上是生活随笔為你收集整理的velocityjs 动画库 比jquery默认的animate强的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。