jquery 动态数字滚动
1、引入jQuery
<script src="js/jquery.min.js"></script>
2、html
<div id="count">14</div>
3、js函数
(function($){
$.fn.numberRock=function(options){
var defaults={
lastNumber:100, //最终值
duration:2000, //时间
easing:'swing' //swing(默认 : 缓冲 : 慢快慢) linear(匀速的)
};
var opts=$.extend({}, defaults, options);
$(this).animate({
num : "numberRock",
// width : 300,
// height : 300,
},{
duration : opts.duration,
easing : opts.easing,
complete : function(){
console.log("success");
},
step : function(a,b){ //可以检测我们定时器的每一次变化
//console.log(a);
//console.log(b.pos); //运动过程中的比例值(0~1)
$(this).html(parseInt(b.pos * opts.lastNumber));
}
});
}
})(jQuery);
4、js代码
$(function(){
$("#counta").numberRock({
lastNumber:14,
duration:3000,
easing:'swing', //慢快慢
});
});
jquery 动态数字滚动的更多相关文章
- jQuery动态数字翻滚计数到指定数字的文字特效代码
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 用jQuery实现数字滚动效果
html 部分 <div class="js-box box"></div> css 部分 .statistic .box{ display: inline ...
- jQuery 数字滚动插件
这几天闲来没事写的,有不对的地方还请多多指点 CSS: ; padding:0 2px;} .digital-beating i {;; background:url(../images/icon_0 ...
- 一款非常炫酷的jQuery动态随机背景滚动特效
一款非常炫酷的jQuery动态随机背景滚动特效 图片背景会不停息的滚动,带有那种漂浮的视觉效果,小圈圈飘动. 更好的是还兼容IE6浏览器,大伙可以好好研究研究. 适用浏览器:IE6.IE7.IE8.3 ...
- jQuery数字滚动(模拟网站人气、访问量递增)原创
插件描述:实现数字上下滚动,模拟网站人气.访问量递增的动画效果,兼容性如下: 使用方法 $(el).runNum(val,params); 参数详解 val:数值型(默认70225800): pa ...
- jquery 数字滚动方法
jquery 数字滚动方法用的是countUp.js这个插件 target = 目标元素的 ID:startVal = 开始值:endVal = 结束值:decimals = 小数位数,默认值是0:d ...
- jQuery+PHP+Ajax动态数字统计展示实例
jQuery+PHP+Ajax实现的一款动态数字统计展示实例,本例是在页面上动态展示了当前在线用户数,当然了,你可以应用到其他更多场景中. 首先我们在#number放置要统计的数字: <div ...
- jQuery.hhLRSlider 左右滚动图片插件
/** * jQuery.hhLRSlider 左右滚动图片插件 * User: huanhuan * QQ: 651471385 * Email: th.wanghuan@gmail.com ...
- 让数字变化炫酷起来,数字滚动Text组件[Unity]
让数字滚动起来 上周我的策划又提了样需求,当玩家评分发生变动时,屏幕出现人物评分浮层UI,播放评分数字滚动动画.这类数字滚动需求非常常见,我就按一般思路,将startvalue与endvalue每隔一 ...
随机推荐
- python中的open、close、read、write、len、exists
open()打开文件 close()关闭文件 read()读取文件内容 write()写入内容 len()检查文件内容长度 exists()检查文件是否存在 我们举一个例子,将上方的内容全部应用到实际 ...
- 查SQLserver性能瓶颈
https://www.cnblogs.com/wayne-ivan/p/3821750.html
- [Python]查询mysql导出结果至Excel并发送邮件
环境:Linux +python2.7+mysql5.6 1.提前安装xlwt(excel写入操作模块),MySQLdb(mysql操作模块) 2.脚本如下: #!/usr/bin/python #c ...
- css样式表1
1内联样式表 和html联合使用,控制精确,但是可重用性差,冗余多. <p style="font-size:14px;"></p> <div sty ...
- postman 的基础使用
https://blog.csdn.net/fxbin123/article/details/80428216
- 尚硅谷redis学习7-持久化AOF
AOF比RDB优点在于数据的实时性高,经过设置后最多只会损失一秒钟的数据,而RDB最多可能损失上次备份到此次DOWM机间的数据 原理 配置文件 设置同步频率 重启redis,测试,可以看到数据在关机重 ...
- linux 3.10的list_del
最近看到一个page的数据比较奇怪: crash> page ffffea002c239c58 struct page { flags = , _count = { counter = 34-- ...
- Python文件和目录模块介绍:glob、shutil、ConfigParser
glob模块 查找符合特定规则的文件路径名,路径名可以使用绝对路径也可以使用相对路径.查找文件会使用到三个通配符,星号*,问号?和中括号[],其中"*"表示匹配0~n个字符, &q ...
- 安装vue CLI后, 出现安装权限问题
问题:安装vue CLI后,出现:npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules/usr/l ...
- Java8获取当前时间、新的时间日期类如Java8的LocalDate与Date相互转换、ZonedDateTime等常用操作包含多个使用示例、Java8时区ZoneId的使用方法、Java8时间字符串解析成类
下面将依次介绍 Date转Java8时间类操作 ,Java8时间类LocalDate常用操作(如获得当前日期,两个日期相差多少天,下个星期的日期,下个月第一天等) 解析不同时间字符串成对应的Java ...