首页 > 编程知识 正文

包含countup.js速度的词条

时间:2024-04-24 11:43:01 阅读:333572 作者:FUPM

本文目录一览:

CountUp.js数字滚动插件

创建 new CountUp("ID选择器", 开始值, 结束值, 小数位数, 只需时间, options对象)

options对象:{

    useEasing: true,      -----使用缓和

  useGrouping: true,      -----使用分组(是否显示千位分隔符,一般为 true)

  separator: ',',      -----分隔器(千位分隔符,默认为',')

  decimal: '.',     ----- 十进制(小数点符号,默认为 '.')

  prefix: '',    -----字首(数字的前缀,根据需要可设为 $,¥,¥ 等)

  suffix: ''     -----后缀(数字的后缀 ,根据需要可设为 元,个,美元 等

}

val.start()

三部分

设置options对象       创建CountUp    执行.start()

css可以实现countup.js么

CSS可以实现CountUp.js

无依赖的、轻量级的 JavaScript 类,可以用来快速创建以一种更有趣的动画方式显示数值数据。尽管它的名字叫 countUp,但其实可以在两个方向进行变化,这是根据你传递的 startVal 和 endVal 参数判断的。

countUp.js是一个轻量经的JavaScript类,没有任何第三方库。可用于以一种有趣的动画展示数字变化。

html 数字实现滚动的效果 到指定的数(使用countup.js插件)

数字实现滚动的效果

span id="num1"1000/span

script src=""/script

script type="text/javascript"   

 var options = {     

 useEasing: true,      

useGrouping: true,      

separator: ',',      

decimal: '.', 

  };   

 var num1 = new CountUp('num1', 0, 1000, 0, 2.5, options);   

 if (!num1.error) {    

 num1.start();  

  } else {     

 console.error(num1.error); 

   }

/script

//num1:目标元素的ID 

 //0:滚动开始的数字

//100:滚动结束的数字

//2.5 :完成整个效果的时间

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。