javascript - アニメーション化されたパーセンテージに同期してJavaScriptアニメーション化されたバーを作成する

Question

私が直面した問題は、アニメーション バーをパーセンテージ I に同期させる方法がわからないことです。今は問題ないように見えますが、値 '43' を '100' に変更すると、パーセンテージ カウンターが遅くなります。

コード例:

$(document).ready(function(){
                $(".barInner").animate({
                    width: 43 + "%",
                    opacity: 1
                }, 2500 );

                var display = $('.barInner');
                var currentValue = 0;
                var nextValue    = 43;

                var diff         = nextValue - currentValue;
                var step         = ( 0 < diff ? 1 : -1 ); 

                for (var i = 0; i < Math.abs(diff); ++i) {
                    setTimeout(function() {
                        currentValue += step
                        display.text(currentValue + "%");
                    }, 54 * i)   
                }
            });

http://jsfiddle.net/vTKw7/

前もって感謝します、

ニック