html:

<div class="wz1">0</div>

css:

.wz1{
width: 114px;
height: 30px;
position: absolute;
top: 40px;
left: 75px;
color:#fff;
font-size: 30px;
}

js:(写在预加载函数中)

let val2 = document.getElementsByClassName("wz2")[0];
animateNum(val2, 8397, 0);

// 初始值 结束值 几个小数点
function animateNum(dom, val, dot){
let obj = {num1: dom.innerHTML};
TweenMax.to(obj, 1, {
num1: val,
onUpdate:function(){
dom.innerHTML=obj.num1.toFixed(dot);
},
delay: 0.1
});
}

如果报错了,继续往下拉--

记得引入tweenmax.js的插件哦

tweenMax+如何让数字由初始值动画到结束的值的更多相关文章

  1. css3动画中的steps值详解

    css3的动画的animation-timing-function属性定义了动画的速度曲线,一般的速度曲线大家都知道,什么ease,linear,ease-in,ease-out,还有自定义贝塞尔曲线 ...

  2. CATransform3D的m34值动画

    CATransform3D的m34值动画 效果 源码 https://github.com/YouXianMing/Animations // // CATransform3DM34Controlle ...

  3. Win8 Metro(C#)数字图像处理--2.56简单统计法图像二值化

    原文:Win8 Metro(C#)数字图像处理--2.56简单统计法图像二值化  [函数名称] 简单统计法图像二值化 WriteableBitmap StatisticalThSegment(Wr ...

  4. Win8 Metro(C#)数字图像处理--2.58双峰法图像二值化

    原文:Win8 Metro(C#)数字图像处理--2.58双峰法图像二值化  [函数名称]   双峰法图像二值化 WriteableBitmap  PeakshistogramThSegment( ...

  5. (C++)读取一个输入的int型十进制数字的位数,并正序输出每个位上的值(不同数位的值用1个空格字符间隔)

    1 /* 2 程序功能:读取一个输入的int型十进制数字的位数,并正序输出每个位上的值(不同数位的值用1个空格字符间隔). 3 例如:当输入985这个数字时,显示如下信息: 4 985是一个3位数字! ...

  6. JavaScript一道面试题求y的值是? z 的值是? s的值是?

    原文:http://www.zhufengpeixun.cn/JavaScriptmianshiti/2014-04-01/287.html < script type = "text ...

  7. jquery data方法取值与js attr取值的区别

    <a data-v="3"></a> jquery data方法的运行机制: 第一次查找dom,使用attributes获取到dom节点值,并将其值存到缓存 ...

  8. Java中只有值传递,(及值传递与引用传递详解)

    首先呢,我们来说一下值传递与引用传递的区别(这两个玩意儿实在调用函数的时候提到的) 比如说 code( a) code( int a ) code(a)是调用函数,a是我们原本函数的一个值类型,然后使 ...

  9. R_Studio(癌症)以等宽类别值、自定义类别值、等频类别值(分为5类)

    对“癌症.csv”中的肾细胞癌组织内微血管数进行连续属性的离散化处理 增加“微血管数分类1”属性,取值为等宽类别值(分为5类),增加“微血管数分类2”属性,取值为自定义类别值(0~40,41~60,6 ...

随机推荐

  1. ES6标准入门 第四章:字符串的扩展

    1.字符串的Unicode 表示法 JavaScript 允许采用 \uxxxx 表示一个字符,其中 xxxx 表示字符的码点. "\u0061" // "a" ...

  2. linux sed 命令 实现对文件的增删改替换查 实验

    1. 统一实验文本 # 创建包含下面内容的文件,后面的操作都会使用这个文件 [root@MongoDB ~]# cat person.txt ,mike,CEO ,jack,CTO ,yy,CFO , ...

  3. [19/06/07-星期五] CSS基础_布局&定位&背景样式

    一.固定布局(不适应设备的浏览器的变化) <!DOCTYPE html> <html> <head> <meta charset="UTF-8&qu ...

  4. 【转】centos7安装

    转自:https://blog.csdn.net/qq_42570879/article/details/82853708 1.CentOS下载CentOS是免费版,推荐在官网上直接下载,网址:htt ...

  5. java8--- Optional的使用

    // https://www.jianshu.com/p/82ed16613072 1.Optional.of(T value),传入非 null(否则会抛出 NullPointerException ...

  6. MyBatis二级缓存的笔记及记录

    一.什么是二级缓存: 由于一级缓存是一次性的.临时的:每个会话都会创建一个新的:多个会话之间是不能共享的: 二级缓存用于解决一级缓存的不足:每一个“namespace”都会对应一个二级缓存:执行查询的 ...

  7. java基础笔记(6)

    xml文件的写入 通过dom生成xml文件: package com.writexml; import java.io.File; import javax.xml.parsers.DocumentB ...

  8. P3958奶酪

    这个题是2017noip提高组的真题,是一个深度搜索题,得分轨迹:10-80-100pts. 在三维空间里,存在可能连通的洞(半径r),问是否可以通过这些洞从底部到达顶部.一开始我联想到了01迷宫,以 ...

  9. [多校联考2019(Round 4 T2)][51nod 1288]汽油补给(ST表+单调栈)

    [51nod 1288]汽油补给(ST表+单调栈) 题面 有(N+1)个城市,0是起点N是终点,开车从0 -> 1 - > 2...... -> N,车每走1个单位距离消耗1个单位的 ...

  10. linux获取外网ip

    引言:目前获取ip的方法中,ifconfig和ip获取函数得到的都是内网ip.有时候需要获取外网ip,目前通用的做法,是向外部服务器发送请求,解析外部服务器响应,从而得到的自己的外网ip.linux下 ...