Skip to main content
 首页 » 编程设计

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

2026年05月17日37yxwkf

当您的页面具有复杂的动画、多个 div 以及其上的一些抽象(如 Knockout.js)时,有时很难理解为什么某些元素在动画时会跳跃。

一种调试方法是查找设置动画的所有位置,然后乘以动画长度。这当然可能非常乏味。

问题

是否有一些不错的肮脏技巧可以以慢动作显示当前页面的所有 jQuery 动画?

请您参考如下方法:

您可以扩展 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