递增/递减数字jQuery



我从Joss Crowcroft的解决方案中找到了这段代码,也许与这个问题类似,jquery动画十进制数字递增递减TS在jsfiddle示例上做了一个示例

jQuery({someValue: 0}).animate({someValue: 110}, {
duration: 1000,
easing:'swing', // can be anything
step: function() { // called on every step
    // Update the element's text with rounded-up value:
    $('#el').text(Math.ceil(this.someValue) + "%");
}});

但我的问题不同,当我把末尾someValue110改成1000000或数百万这样的大数字时。animate数字的末尾将不再像someValue的末尾那样精确,有时它可能会以999876或1000000以下的值结束。如何使动画数字的结尾与endValue完全相同?

您可以提供一个done函数,该函数将在动画结束时调用,就像Orbling建议的那样:

$({numberValue: currentNumber}).animate({numberValue: 1000000}, {
    duration: 8000,
    easing: 'linear',
    step: function () { 
        $('#dynamic-number').text(Math.ceil(this.numberValue)); 
    },
    done: function () {
        $('#dynamic-number').text(Math.ceil(this.numberValue));
    }
});

工作小提琴:http://jsfiddle.net/WZC4F/

最新更新