В прошлый раз я сталкивался с эффектом достижения роста числа в проекте и достижения роста числа от 0 до целевого числа. Давайте посмотрим на диаграмму эффекта
Теперь расширяйте его, чтобы достичь разных эффектов
Основными идеями являются две части
1. Добавить каждые три числа,
2. Двигайтесь
Очень удобно использовать регулярно для завершения процесса
this.fomatnum = function (num) {var str = num.tofixed (this.option.decimal); // Сколько именно десятичных помещений var num1, x1, x2, reg; arr = str.split ("."); x1 = arr [0]; x2 = arr.length> 1? '.' + arr [1]: ""; reg =/(/d+) (/d {3})/; if (this.option.isfomat) {while (reg.test (x1)) {x1 = x1.replace (reg, '$ 1' + "," + "$ 2"); }} if (this.option.isfomat) {return this.option.prefix + x1 + x2; } else {return this.option.prefix + str; }} Чтобы достичь комбинированного эффекта, вы можете использовать метод requestAnimationFrame и затем обработать совместимость.
var изменение = function () {var p = math.min (1.0, (new Date (). getTime () - that.StartTime)/that.option.duration); // Текущее время вычитается с времени начала, а затем делится на общее время, математика. Мин, а два числа принимают минимальное значение. var nums = that.num * p; это. if (p <1.0) {// requestAnimationFrame (function () {change ();}); } else {CancelanimationFrame (изменение); }} requestAnimationFrame (function () {change ();});Если вы хотите достичь эффекта движущихся чисел в визуальной области, вы можете прослушать, находится ли DOM в визуальной области, а затем назвать его.
Вышеуказанное - все содержание этой статьи. Если у вас есть какие -либо вопросы, пожалуйста, оставьте сообщение для обсуждения. Спасибо за поддержку Wulin.com.