css翻轉計數器 - 無法設置正確的步伐

我已經實現了Chris Nanney的css/js翻轉計數器，您可以在其中看到jsfiddle http://jsfiddle.net/H4PLA/1/。css翻轉計數器 - 無法設置正確的步伐

的問題，我是，我將通過設置在下面的代碼專案參數想到，我可以定義： - 起始值， - 終值， - 增值， - 步伐，與這個腳本在我的HTML頁面的結尾：

var value = 0; 
var endVal = 99; 
var inc = 9; //between 0 and 1000 
var pace = 400; // between 400 and 2000 
var nextCount; 

var myCounter = new flipCounter('flip-counter', { 
value: value, 
auto: false 
}); 

    function doCount() { 
value = value + inc >= endVal ? value + inc : endVal; 
myCounter.setValue(value); 
nextCount = value != endVal ? setTimeout(doCount, pace) : null; 
    } 

    doCount();

不知怎的，不過，最終的結果（值= 99）被顯示爲0到99 已經有人有任何想法，爲什麼之間沒有實時的動態增量直線距離？謝謝。

來源

2014-10-30 lauWM

我跑過你的小提琴，什麼都沒有發生？ – 2014-10-30 14:02:18

行value = value + inc >= endVal ? value + inc : endVal;將value設置爲endVal，如果value + inc小於endVal，您確實需要嗎？我相信你想要的是value = value + inc <= endVal ? value + inc : endVal;

來源

2014-10-30 14:01:07 Markai

美麗！謝謝。我知道我應該進入js ... – lauWM 2014-10-30 14:15:06

不客氣。只是繼續前進，一切都是關於鍛鍊:) – Markai 2014-10-30 14:18:54

你有不好的對比，在doCount function改變>=到<。

來源

2014-10-30 14:00:22 bemol

var value = 1328; 
var endVal = 2750; 
var inc = 1; //Change 
var pace = 600; 
var nextCount; 

var myCounter = new flipCounter('flip-counter', { 
    value: value, 
    auto: false 
}); 

function doCount() { 
    value = value + inc < endVal ? value + inc : endVal; // Change 
    myCounter.setValue(value); 
    nextCount = value != endVal ? setTimeout(doCount, pace) : null; 
} 

doCount();

來源

2014-10-30 14:06:38

請詳細說明你的答案，很難說你從OP粘貼的原始代碼中真正改變了什麼...... – webeno 2014-10-30 14:24:47

value = value + inc >= endVal ? value + inc:endVal;

此行跳過對末端，因爲:的右側會觸發時value + inc >= endVal是假的，它是。 value + inc在開始時不大於endVal。

nextCount = value != endVal ? setTimeout(doCount, pace) : null;

此行僅僅是混亂的，你甚至不使用下一個計數變量，超時不返回有用的值。那麼爲了清晰起見：

if (value != endVal) setTimeout(doCount, pace)

來源

2014-10-30 14:08:43

css翻轉計數器 - 無法設置正確的步伐

回答

相關問題