数字滚动累加动画插件  NumScroll

1.使用前先引入jquery
2.前端学习群:814798690

下载地址

https://github.com/chaorenzeng/jquery.numscroll.js/archive/master.zip

案例展示

快速使用

1.引入jquery和jquery.numscroll.js

<script src='http://code.jquery.com/jquery-2.1.1.min.js' type='text/javascript'></script>
<script src="js/jquery.numscroll.js" type="text/javascript" charset="utf-8"></script>

2.拷贝以下布局结构

<span class="num">888888</span>

3.创建numscroll对象:

$(".num").numScroll();

可选参数

可选参数 默认值 说明
time 1500 滚动总时长
delay 0 延迟启动时长

#Plugin 数字滚动累加动画插件的更多相关文章

  1. scrollreveal(页面滚动显示动画插件支持手机)

    scrollreveal.js是一款可以轻易实现桌面和移动浏览器元素随页面滚动产生动画的js插件.该插件通过配置可以在页面滚动,元素进入视口时产生炫酷的动画效果,同时还支持元素的3D效果,非常的实用. ...

  2. 一款很好用的页面滚动元素动画插件-AOS.JS

    aos.js是一款效果超赞的页面滚动元素动画jQuery动画库插件.该动画库可以在页面滚动时提供28种不同的元素动画效果,以及多种easing效果.在页面往回滚动时,元素会恢复到原来的状态. 加载方法 ...

  3. 数字滚动特效 NumScroll

    1.使用前先引入jquery2.前端学习群:814798690 下载地址 https://github.com/chaorenzeng/jquery.numscroll.js.git 快速使用 1.引 ...

  4. jQuery数字滚动（模拟网站人气、访问量递增）原创

    插件描述:实现数字上下滚动,模拟网站人气.访问量递增的动画效果,兼容性如下: 使用方法 $(el).runNum(val,params);   参数详解 val:数值型(默认70225800): pa ...

  5. jquery轻量级数字动画插件jquery.countup.js

    插件描述: jquery.countup.js 是一款轻量级jquery数字动画插件.该数字动画插件可以在页面滚动时,将指定的数字从0开始计数增加动画. 插件说明 jquery.countup.js  ...

  6. jQuery 数字滚动插件

    这几天闲来没事写的,有不对的地方还请多多指点 CSS: ; padding:0 2px;} .digital-beating i {;; background:url(../images/icon_0 ...

  7. 好用的jquery.animateNumber.js数字动画插件

    在做公司的运营报告页面时,有一个数字累计增加的动画效果,一开始,毫无头绪,不知如何下手,于是上网查资料,发现大多都是用的插件来实现的,那么今天,我也来用插件jquery.animateNumber.j ...

  8. ScrollReveal-元素随页面滚动产生动画的js插件

    简介 和 WOW.js 一样,scrollReveal.js 也是一款页面滚动显示动画的 JavaScript,能让页面更加有趣,更吸引用户眼球.不同的是 WOW.js 的动画只播放一次,而 scro ...

  9. Vue.js大屏数字滚动翻转效果

    ================================ 大屏数字滚动翻转效果来源于最近工作中element后台管理页面一张大屏的UI图,该UI图上有一个模块需要有数字往上翻动的效果,以下是最 ...

随机推荐

  1. 深入理解 sudo 与 su 之间的区别【转】

    深入理解 sudo 与 su 之间的区别 两个命令的最大区别是: sudo 命令需要输入当前用户的密码,su 命令需要输入 root 用户的密码.另外一个区别是其默认行为.sudo 命令只允许使用提升 ...

  2. 获取本地计算机名和IP地址

    WSADATA wsadata; != WSAStartup(MAKEWORD(, ), &wsadata)) { AfxMessageBox("初始化网络环境失败!"); ...

  3. 用户 'IIS APPPOOL\xxxx' 登录失败

    一.现象发布到iis后,网站出现以下提示异常详细信息: System.Data.SqlClient.SqlException: 用户 'IIS APPPOOL\IdealTest' 登录失败. 二.分 ...

  4. $Django content_type组件 缓存组件

    1  content_type组件(只能方便插入添加) 需求:课程,学位课(不同的课程字段不一样),价格策略 #免费课 class Free_classes (models.Model): id = ...

  5. LabVIEW--为控件添加说明信息

    之前只知道为VI添加说明信息(在VI的属性里面添加,快捷键ctrl+I 打开),今天知道了控件也可以添加说明信息,这样就方便了许多,极大的提高了程序的可读性.

  6. grep,find

    grep是强大的文本搜索工具,他可以对文件逐行查看,如果找到匹配的模式,就可以打印出包含次模式的所有行,并且支持正则表达式 find查找文件的grep是来查找字符串的,文件的内容 grep 文件的内容 ...

  7. HomeBrew 安转beta版软件

    今天想装测试版的cocoapods,用 brew install cocoapods 后,总是安装稳定版,就是1.1.0,不是最新的beta版,发现用下面这个命令可以装最新beta版 brew ins ...

  8. yum报错：Error: Multilib version problems found. This often means that the root

    使用yum安装一些依赖库报错: yum -y install gcc gcc-c++ pcre pcre-devel zlib zlib-devel openssl openssl-devel 错误信 ...

  9. Java对数

    java对数 先看看Java源码里的对数函数(在Java.lang.Math里) 方法1:log() 作用:返回以自然常数e为底数的对数值 说明: e ≍ 2.71828 18284 59045 23 ...

  10. 本地http://localhost打不开怎么办

    本地http://localhost打不开怎么办 出自:http://jingyan.baidu.com/article/c45ad29cebb95a051753e2b6.html 学过计算机的都知道 ...