请问jQuery的动画是怎么实现的

Question

用js写的动画总是因为定时器问题而不够流畅，jQuery却没有这个问题_(:з」∠)_

Answer 1

$(".ani").animate({"marginLeft":"100px"},2000)

例如这个动画效果，应该使用setinterval控制marginleft累加完成动画效果。

你说不够流畅，不知道是不是在手机端发现不流畅，手机端的话建议动画都用css3完成。

Answer 2

避免大量的重排与重绘，另外使用 transform 等 CSS3 属性可提升性能，前者网上已经有很多文章，后者可看 Chrome 渲染解析的文章了解。

Answer 3

jQuery是通过定时器来控制动画的。

jQuery.fx.interval = 13;
jQuery.fx.start = function() {
    if ( !timerId ) {
        timerId = setInterval( jQuery.fx.tick, jQuery.fx.interval );
    }
};

jQuery.fx.tick 有处理动画的代码。

其实，动画的用 HTML5的 window.requestAnimationFrame