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. Flink数据流图的生成----简单执行计划的生成

    Flink的数据流图的生成主要分为简单执行计划-->StreamGraph的生成-->JobGraph的生成-->ExecutionGraph的生成-->物理执行图.其中前三个 ...

  2. 自己整理JS数据的基本知识

    自己整理JS数据的基本知识 javascript部分: 1.引入的方式包括外链和内联. 2.JS的数据类型有哪些? 原始类型和引用类型; undefined类型,值为undefined; null类型 ...

  3. Java面试题集(86-115)

    Java程序员面试题集(86-115) 摘要:下面的内容包括Struts 2和Hibernate的常见面试题,虽然Struts 2在2013年6月曝出高危漏洞后已经显得江河日下,而Spring MVC ...

  4. 【工具】Fiddler使用教程

    目录 概述 2 Fiddler是做什么的,能帮助我们做什么? 2 工作原理 2 代理模式 3 使用场景--提供的功能 3 界面及使用介绍 3 常用功能 10 HOST配置 10 前后端接口连调--Co ...

  5. appium常见问题01_android筛选下拉框无法定位问题

    近期用appium做android自动化的过程中,遇到一种筛选下拉框,神奇的是,定位工具定位怎样都定位不到. 首先尝试用uiaotomator工具定位,无法定位到下拉框元素,只能定位到底层元素: 询问 ...

  6. centos 7 里如何判断IP是否合法

    ip=123.23.2.32; [[ $ip =~ ^(([1-9]?[0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9 ...

  7. laravel框架源码分析(一)自动加载

    一.前言 使用php已有好几年,laravel的使用也是有好长时间,但是一直对于框架源码的理解不深,原因很多,归根到底还是php基础不扎实,所以源码看起来也比较吃力.最近有时间,所以开启第5.6遍的框 ...

  8. [转帖]SQL 里面的 case when 的用法

    SQL之case when then else end用法介绍 https://www.2cto.com/database/201804/740772.html 要培训了 看到有case when 之 ...

  9. 使用ntpdate 同步 linux的时间

    1. linux 查看时间和时区的命令 timedatectl 效果为: Local time: Sun -- :: CST Universal time: Sun -- :: UTC RTC tim ...

  10. Java 14 可能带来什么新特性?

    JDK/Java 13 在一个月前已经发布,该版本带来了 5 大新特性,笔者观察到其中的 Text Blocks(文本块)特性似乎被讨论最多. 文本块特性与常见的 Python "" ...