CountUp.js 数字跳转效果小插件
CountUp.js 实现数字跳转效果的小插件
//调用方法
const easingFn = function (t, b, c, d) {
var ts = (t /= d) * t;
var tc = ts * t;
return b + c * (tc * ts + -5 * ts * ts + 10 * tc + -10 * ts + 5 * t);
}
const options = {
startVal: 5240, //开始时间
duration: 2.1, //动画效果时间
easingFn,
};
let demo = new CountUp('myTargetElement', 60000 //结束时间, options);
if (!demo.error) {
demo.start();
} else {
console.error(demo.error);
}
展示demo地址:http://inorganik.github.io/countUp.js/
CountUp.js 数字跳转效果小插件的更多相关文章
- js 实现吸顶效果 || 小程序的吸顶效果
小程序吸顶效果 <!--index.wxml--> <view class="container"> <view class='outside-img ...
- jquery轻量级数字动画插件jquery.countup.js
插件描述: jquery.countup.js 是一款轻量级jquery数字动画插件.该数字动画插件可以在页面滚动时,将指定的数字从0开始计数增加动画. 插件说明 jquery.countup.js ...
- Countup.js:vue-countup-v2(npm)数字滚动插件
1.官方地址:http://inorganik.github.io/countUp.js/ 2.官方demo: 3.参数说明: params——start(开始数字).end(结束数字).decima ...
- CountUp.js用法 让数字动起来的插件
CountUp.js 无依赖的.轻量级的 JavaScript 类,可以用来快速创建以一种更有趣的动画方式显示数值数据.尽管它的名字叫 countUp,但其实可以在两个方向进行变化,这是根据你传递的 ...
- CountUp.js – 让数字以非常有趣的动画方式显示
CountUp.js 无依赖的.轻量级的 JavaScript 类,可以用来快速创建以一种更有趣的动画方式显示数值数据.尽管它的名字叫 countUp,但其实可以在两个方向进行变化,这是根据你传递的 ...
- Vue.js大屏数字滚动翻转效果
================================ 大屏数字滚动翻转效果来源于最近工作中element后台管理页面一张大屏的UI图,该UI图上有一个模块需要有数字往上翻动的效果,以下是最 ...
- 浮动【电梯】或【回到顶部】小插件:iElevator.js
iElevator.js 是一个jquery小插件,使用简单,兼容IE6,支持UMD和3种配置方式,比锚点更灵活. Default Options _defaults = { floors: null ...
- 好用的jquery.animateNumber.js数字动画插件
在做公司的运营报告页面时,有一个数字累计增加的动画效果,一开始,毫无头绪,不知如何下手,于是上网查资料,发现大多都是用的插件来实现的,那么今天,我也来用插件jquery.animateNumber.j ...
- 黑色半透明镂空遮罩指引效果实现jQuery小插件
/*! * by zhangxinxu(.com) 2017-05-18 * 新版上线时候的黑色半透明镂空遮罩指引效果实现jQuery小插件 * 兼容到IE8+ * MIT使用协议,使用时候保留版权 ...
随机推荐
- C++连接sqlite数据库的增删查改操作
这个代码是接着上次说的,要用VS2013操作数据库,首先要配置好环境,创建好数据库表等. 不明白的翻我前面2篇看看~~~ 关于前面的用到的goto 语句,这个我也是参考其他博主写的,现在我注释掉了,毕 ...
- nginx安全参数
Strict-Transport-Security Strict-Transport-Security,简称 HSTS.该响应头用于标识浏览器用 HTTPS 替代 HTTP 的方式去访问目标站点. 我 ...
- CheckBox标签和属性
CheckBox的作用:可以提供复选 下面是我点击按钮查看所选内容的代码:定义按钮监听器,并在onClick方法中调用shoeAlt方法(此方法会在第二块代码定义) Button btn=(Butto ...
- arduino 通过串口接收string,int类型数据
串口接收string类型数据源码如下 String comdata = ""; void setup() { Serial.begin(9600); } void lo ...
- 博客已经转到www.vsyf.me/blog
租了个服务器,重搭了个博客 阿发的博客
- 修改序列(Sequence)的初始值(START WITH)
1 执行:Alter Sequence SeqTest2010_S Increment By 1007; 2 执行:Select SeqTest2010_S.NextVal From Dual; 3 ...
- 069-PHP数组下标
<?php $arr=array(98,'hello',67,'A',85,NULL); //定义一个数组 $x=0; //定义三个作为下标的变量 $y=3; $z=5; echo " ...
- 056-for循环中continue的使用
<?php ; $i <= ; $i++) { //for循环输出数值 == ) //判断变量是否为3的整数倍 { continue;//跳过本次循环剩余语句 } echo "$ ...
- vue学习(一)ES6常用语法
1 ES6常用语法 1.1 变量提升 例① # 变量提升 <div id="app"> </div> <script> console.log( ...
- 【Android】家庭记账本手机版开发报告六
一.说在前面 昨天 1.创建登入和注册界面:2.向数据库添加一张用户表 今天 用图标显示账单情况 问题 1.使用第三方库 hellochart,时添加依赖构建失败 2.在 chertFragmen ...