jquery对象数值步进显示效果
来源:互联网 发布:淘宝店运营方案论文 编辑:程序博客网 时间:2024/06/08 03:07
一、需求描述:在项目中有时需要页面显示数值的元素,在页面刷新时数值从零动态增加到指定值的显示效果,本文即为该效果的简单实现。
二、代码:
;(function($){ ;(function($){ $.fn.autoIncreActive = function(totaltime,speed){//数字逐渐增加显示时,totaltime数字加载总时间 var $self = $(this); var loops = Math.ceil(totaltime/speed); return $self.each(function(index,element){ var value = 0,tempval; if(isNaN(Number($(element).text()))){ throw "not a number"; return false; }else{ value = Number($(element).text()); tempval = value; } if($(element).data("timer")){ clearInterval($(element).data("timer")); $(element).removeData("timer"); } $(element).data("timer",setInterval(function(){ value = value - Math.ceil(tempval/loops); if(value<0){ value = 0; clearInterval($(element).data("timer")); $(element).removeData("timer"); } $(element).text(tempval-value); },speed)); }); }})(jQuery);
参考:
http://www.17sucai.com/preview/1/2014-08-01/%E6%95%B0%E5%AD%97%E5%8A%A8%E7%94%BB/js/index.js
阅读全文
0 0
- jquery对象数值步进显示效果
- C#中dataGridView1控件数值显示效果
- jQuery 显示效果插件
- jQuery显示效果
- jquery动画显示效果
- AS3----游戏中显示加减血数值显示效果
- jQuery 效果 - 隐藏和显示
- jquery 隐藏和显示效果
- jQuery 效果 - 隐藏和显示
- jQuery 效果- 隐藏和显示
- jQuery Treeview默认显示效果
- jQuery 效果- 隐藏和显示
- 10007---jQuery效果--显示/隐藏
- jquery效果-隐藏与显示
- jQuery 效果 - 隐藏和显示
- jQuery 效果 - 隐藏和显示
- Jquery 隐藏及显示效果
- jQuery 效果- 隐藏和显示
- 函数调用栈
- HBase 总结(五)
- 分布式与集群
- CSS3 2 2D 3D转换
- JDBC连接池&DBUtils
- jquery对象数值步进显示效果
- 获取post请求的数据
- PL/SQL 游标(cursor)的使用
- C_逻辑题: 石头,剪刀,布
- Java 8 Function之Predicate
- 分布式事务
- 证明题 8.10
- css三种书写格式以及import与link的区别
- 前端学习笔记--AJAX的使用(一)