Question

当你有一个包含多个div的复杂动画的页面和一些顶部的抽象（如knockout.js）时，有时很难理解为什么有些元素在动画时会跳转。

调试的一种方法是查找动画设置的所有位置，并将动画长度相乘。这当然是相当繁琐的。

问题

是否有一些很好的脏黑客以慢动作显示当前页面的所有jQuery动画？

Answer 1

您可以扩展animate方法，例如：

（但是持续时间也可以作为选项对象的属性传递，你也必须处理这种情况！）

;(function($) {
    var slowingCoeff = 10;
    $.fx.speeds = {
        slow: slowingCoeff * 600,
        fast: slowingCoeff * 200,
        _default: slowingCoeff * 400
    };
    var oAnimate = $.fn.animate;
    $.fn.animate = function(prop, speed, easing, callback) {        
        if(typeof speed === "number")
            speed *= slowingCoeff;
        return oAnimate.call(this, prop, speed, easing, callback);
    }    

})(jQuery);

basic DEMO

以慢动作播放jQuery动画以进行调试

1 个答案: