Zepto.js中提供了哪些webkit动画

Question

我正在调查Zepto.js的移动项目,但没有找到关于.anim操作的大量文档.我知道它是webkit特定的,但webkit动画css的哪些部分可以使用？例如,3d转换？

Answer 1

从源代码可以看出,它在-webkit-transform内部使用,因此可以使用它可用的所有内容.

translate3d

$('div').anim({ translate3d: '10px, 20px, 30px'}, 2, 'ease-out');

Zepto.Fx

(function($){
  $.fn.anim = function(props, dur, ease){
    var transforms = [], opacity, k;
    for (k in props) 
        k === 'opacity' ? opacity=props[k] : transforms.push(k+'('+props[k]+')');
    return this.css({ '-webkit-transition': 'all '+(dur||0.5)+'s '+(ease||''),
      '-webkit-transform': transforms.join(' '), opacity: opacity });
  }
})(Zepto);