一个小小的函数,很容易看懂,就不过多解释了,只为下次用时直接用就ok了。。。

function countUp(count)
{
var div_by = 100,
speed = Math.round(count / div_by),
$display = $('.count'),
run_count = 1,
int_speed = 24; var int = setInterval(function() {
if(run_count < div_by){
$display.text(speed * run_count);
run_count++;
} else if(parseInt($display.text()) < count) {
var curr_count = parseInt($display.text()) + 1;
$display.text(curr_count);
} else {
clearInterval(int);
}
}, int_speed);
} countUp(num);

只需要把要显示内容的元素获取下来,还有把要显示的数据写到函数的参数位置即可。。

js 显示数字不断增加的更多相关文章

  1. CountUp.js – 让数字以非常有趣的动画方式显示

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

  2. 快速创建显示数字数据的动画——CountUp.js

    由于项目需求,需要写一个数字增/减量的动画特效,最后找到了CountUp.js CountUp.js是一个无依赖,轻量级的JavaScript“类”,可用于快速创建以更有趣的方式显示数字数据的动画. ...

  3. 前端JS—显示赋值(一)

    一:js代码必须位于<script>js代码</script> 把js代码放到<body>元素的地步,可以改善显示速度 二:js显示数据 使用 window.ale ...

  4. JS将数字转换为中文

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. [收集]在iPhone桌面的应用程序图标右上角显示数字

    能够在ios桌面的程序icon右上角显示数字(badge number)的方法 在ViewController中的viewDidLoad方法中添加如下代码即可 - (void)viewDidLoad ...

  6. js显示当前时间

    闲着没事在闪存里看到有人需要js显示当前时间,就一时兴起写了个. 输出格式:“2013年12月18日 星期三 上午9:05:00 ”. <script type="text/javas ...

  7. js 利用 ajax 加载 js ,显示加载进度 ,严格按照js的顺序先后加载到页面

    js 利用 ajax 加载 js ,显示加载进度 ,严格按照js的顺序先后加载到页面 , 做手机端开发时,发现一个问题,有些浏览器,在网速比较慢的情况下,js文件没有加载完,后续的调用已经开始调用了, ...

  8. js动态数字时钟

    js动态数字时钟 主要用到知识点: 主要是通过数组的一些方法,如:Array.from() Array.reduce() Array.find() 时间的处理和渲染 js用到面向对象的写法 实现的功能 ...

  9. js 格式化数字,格式化金额:

    js 格式化数字,格式化金额: function number_format(number, decimals, dec_point, thousands_sep) { /* * 参数说明: * nu ...

随机推荐

  1. React——共享state

    通常,一些组件需要反映相同的数据更改,这种情况推荐将共享state移动到它们最近的公共祖先上. 在这里有一个例子:有一个温度计算器计算在给定温度是否能让水沸腾,用户可以输入华氏温度也能输入摄氏温度,当 ...

  2. java读取文件乱码

    List<String> lines=new ArrayList<String>(); BufferedReader br = new BufferedReader(new F ...

  3. Nodejs的运行原理-libuv篇

    前言 这应该是Nodejs的运行原理的第7篇分享,这篇过后,短时间内不会再分享Nodejs的运行原理,会停更一段时间,PS:不是不更,而是会开挖新的坑,最近有在研究RPG Maker MV,区块链,云 ...

  4. mysql分区之range分区

    随着互联网的发展,各方面的数据越来越多,从最近两年大数据越来越强的呼声中就可见一斑. 我们所做的项目虽算不上什么大项目,但是由于业务量的问题,数据也是相当的多. 数据一多,就很容易出现性能问题,而为了 ...

  5. HI3531的nand flash测试

    void NAND_Init() {    *(unsigned int *)(0x20030000 + 0xd0) = 7; delay_x(0X5000);    *(unsigned int * ...

  6. 解决Sublime text 3 中文文件名显示方框

    在sublime text 3中,Preference, Settings-User,最后加上一行 "dpi_scale": 1.0 覆盖操作系统设置的DPI. 这是我的Setti ...

  7. R语言实现SOM(自组织映射)模型(三个函数包+代码)

    每每以为攀得众山小,可.每每又切实来到起点,大牛们,缓缓脚步来俺笔记葩分享一下吧,please~ --------------------------- SOM自组织映射神经网络模型 的R语言实现 笔 ...

  8. Column 'id' in where clause is ambiguous

    1.错误描述 org.hibernate.exception.ConstraintViolationException: error executing work at org.hibernate.e ...

  9. Error:dijit.tree.TreeStoreModel:root query returned 0 items

    1.错误描述 error loading root:                                            Tree.js(第341行) Error:dijit.tre ...

  10. 简要分析javascript的选项卡和轮播图

    选项卡 思路 1.按钮和展示的页面要对应:分别遍历,记住当前按钮的索引,让其成为展示页面的索引 2.只出现所对应的页面:所有的页面隐藏,只展示想要的页面 只展示js代码 for(var i=0;i&l ...