Skip to content

Instantly share code, notes, and snippets.

@ecmadao

ecmadao/count.js

Created June 30, 2017 15:40
Show Gist options
  • Save ecmadao/b3e4df79f66a4da93d857c2e6beec1b0 to your computer and use it in GitHub Desktop.
Save ecmadao/b3e4df79f66a4da93d857c2e6beec1b0 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. ecmadao created this gist Jun 30, 2017.
    23 changes: 23 additions & 0 deletions count.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,23 @@

    const {
    elem, // 数字要变化的元素
    endVal = 100, // 最终显示数字
    startVal = 0, // 数字变化开始值
    duration = 1500, // 变化持续时间 (ms)
    decimal = 0 // 小数点位数
    } = options;
    let startTime = 0;
    const dec = Math.pow(10, decimal);
    let progress, value;
    const startCount = (timestamp) => {
    if(!startTime) startTime = timestamp;
    progress = timestamp - startTime;
    value = startVal + (endVal - startVal) * (progress / duration);
    value = (value > endVal) ? endVal : value;
    value = Math.floor(value * dec) / dec;
    // elem.innerHTML = value;
    elem.innerHTML = value.toFixed(decimal);
    progress < duration && requestAnimationFrame(startCount)
    };
    requestAnimationFrame(startCount);
    };