本文實(shí)例為大家分享了countup.js實(shí)現(xiàn)數(shù)字動(dòng)態(tài)疊加效果的具體代碼，供大家參考，具體內(nèi)容如下

我們提供的服務(wù)有：網(wǎng)站建設(shè)、成都做網(wǎng)站、微信公眾號(hào)開(kāi)發(fā)、網(wǎng)站優(yōu)化、網(wǎng)站認(rèn)證、王益ssl等。為近1000家企事業(yè)單位解決了網(wǎng)站和推廣的問(wèn)題。提供周到的售前咨詢和貼心的售后服務(wù)，是有科學(xué)管理、有技術(shù)的王益網(wǎng)站制作公司

CountUp.js 無(wú)依賴的、輕量級(jí)的 JavaScript 類，可以用來(lái)快速創(chuàng)建以一種更有趣的動(dòng)畫方式顯示數(shù)值數(shù)據(jù)。盡管它的名字叫 countUp，但其實(shí)可以在兩個(gè)方向進(jìn)行變化，這是根據(jù)你傳遞的 startVal 和 endVal 參數(shù)判斷的。 再加上滾輪事件判斷。

可配置的參數(shù)：

• target = 目標(biāo)元素的 ID；
• startVal = 開(kāi)始值；
• endVal = 結(jié)束值；
• decimals = 小數(shù)位數(shù)，默認(rèn)值是0；
• duration = 動(dòng)畫延遲秒數(shù)，默認(rèn)值是2；

舉例：

var options = {

  useEasing: true, 
  useGrouping: true, 
  separator: ',', 
  decimal: '.', 
};
var demo = new CountUp('myTargetElement', 0, 4068, 0, 2.5, options);
if (!demo.error) {
  demo.start();
} else {
console.error(demo.error);

安裝：

npm i countup.js

在vue中使用：

演示地址：countUp.js

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。