神坑记录:
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%"},); #神坑:transform: translate3d(80%,0,0); 无法作为参数,必须修改为这种:translateX: 0%
Velocity(el,{translateX: "0%"},250,"ease");