用JQuery内置animate方法实现数字递增动画
2024-09-01 18:25:13
平时使用animate只用于dom节点的动画,无意间发现JQuery内置的animate方法可实现数字动画,JQ还是挺强大的!
动画效果为从0一步步跳到84,代码如下:
$({
// 起始值
countNum: 0
}).animate({
// 最终值
countNum: 84
}, {
// 动画持续时间
duration: 3000,
easing: "linear",
step: function() {
// 设置每步动画计算的数值
$('#num').text(Math.floor(this.countNum));
},
complete: function() {
// 设置动画结束的数值
$('#num').text(this.countNum);
}
});
最新文章
- C# 本质论 第四章 方法和参数
- PHP如何判断一个数组是一维数组或者是二维数组?用什么函数?
- 使用Mulesoft建立webservice, simple方式,POJO
- What's going on in background?
- .net 控件
- 连载《一个程序猿的生命周期》-28、被忽悠来的单身HR(女同志)
- 实战Centos系统部署Codis集群服务
- Android的SwipeToDismiss第三方开源框架模拟QQ对话列表侧滑删除,置顶,将头像图片圆形化处理。
- git 创建branch分支【转】
- Linux学习之(())操作符
- HotSpot的算法实现
- ElasticSearch - 信息聚合系列之聚合过滤
- spring boot错误: 找不到或无法加载主类
- 201671010142 2017-2 《java第九章学习感悟》
- mybatis(3)---传参数的方法
- 前端数据库——WebSQL和IndexedDB
- JAVA记录-maven JDK配置和常用操作
- linux VIM 下的语法高亮及自动缩进
- .NET Entity Framework (with Oracle ODP.NET) -Code First
- ASP.NET WebForm Form表单如何实现MVC那种“自动装配”效果呢?