js 数字滚动效果

count.js

  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);
};

• https://www.denpe.com/javascript-number-dynamic/
• https://codepen.io/jieli/pen/grGoxJ?css-preprocessor=none
• http://inorganik.github.io/countUp.js/