首页 JS特效 jQuery特效 jQuery数字滚动增加动画特效

jQuery数字滚动增加动画特效

jQuery数字滚动增加动画特效

jQuery数字滚动增加动画特效

js代码

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/digitalScroll.js"></script>
<script type="text/javascript">
var sum = 13000;
$(function() {
	setInterval(function(){
		show_num1(sum)
	},1000);
});

function show_num1(n) {
	sum=sum+5;
	console.log(n);
	var it = $(".t_num1 i");
	var len = String(n).length;
	for(var i = 0; i < len; i++) {
		if(it.length <= i) {
			$(".t_num1").append("<i></i>");
		}
		var num = String(n).charAt(i);
		//根据数字图片的高度设置相应的值
		var y = -parseInt(num) * 58;
		var obj = $(".t_num1 i").eq(i);
		obj.animate({
			backgroundPosition: '(0 ' + String(y) + 'px)'
		}, 'slow', 'swing', function() {});
	}
	$("#cur_num").val(n);
}
</script>
jQuery数字滚动增加动画特效是一款样式经过美化的数字上下滚动累加动画效果。 

免责声明

本站所有资源均由网友贡献或各大下载网站转载。请自行检查软件的完整性!本站所有资源仅供学习参考。请不要将它们用于商业目的。否则,一切后果由您负责!如有侵权,请联系我们删除。联系方式:admin@php.cn

相关文章

vue如何实现数字滚动增加效果?代码示例 vue如何实现数字滚动增加效果?代码示例

01 Dec 2020

项目中需要做数字滚动增加的效果,一开始很懵,研究了一下原理,发现很简单,贴出来分享一下 ^_^

如何使用 jQuery 有效地将动态加载内容中的特定文本字符串加粗? 如何使用 jQuery 有效地将动态加载内容中的特定文本字符串加粗?

24 Nov 2024

使用 jQuery 查找文本字符串并将其加粗在元素中查找特定文本字符串并修改其外观是一项常见任务...

如何使用 jQuery 在特定 Div 滚动可见时精确触发数据加载? 如何使用 jQuery 在特定 Div 滚动可见时精确触发数据加载?

05 Nov 2024

使用 jQuery 精确控制用户滚动的数据加载在 Web 开发中,实现无限滚动对于增强用户体验至关重要...

jQuery实现表单里文字按钮特效合集 jQuery实现表单里文字按钮特效合集

25 Apr 2018

这次给大家带来jQuery实现表单里文字按钮特效合集,jQuery实现表单里文字按钮特效的注意事项有哪些,下面就是实战案例,一起来看一下。

jQuery 如何高效地选择具有特定 CSS 属性的元素? jQuery 如何高效地选择具有特定 CSS 属性的元素?

30 Nov 2024

在 jQuery 中选择具有特定 CSS 属性的元素问题:我们如何有效地选择拥有特定 CSS 属性的所有元素...

如何在 jQuery 中捕获鼠标滚轮事件? 如何在 jQuery 中捕获鼠标滚轮事件?

26 Oct 2024

在 jQuery 中捕获鼠标滚轮事件 jQuery 提供了一种有效的方法来捕获特定的鼠标滚轮事件,与滚动事件不同。这...

如何使用 jQuery 和 JavaScript 高效解析和显示 JSON 数据? 如何使用 jQuery 和 JavaScript 高效解析和显示 JSON 数据?

06 Dec 2024

使用 jQuery 和 JavaScript 解析 JSON 数据这个简短的教程解决了有效操作 JSON 数据的挑战,特别是...

jQuery与Zepto是什么区别 jQuery与Zepto是什么区别

20 Nov 2020

jQuery与Zepto区别:1、添加id时jQuery不会生效而Zepto会生效;2、zepto中没有为原型定义extend方法而jquery有;3、zepto由盒模型决定,而jquery会忽略盒模型。

css3动画和jquery动画有什么区别 css3动画和jquery动画有什么区别

28 Apr 2022

css3动画和jquery动画的区别:1、css3可以设置3d动画,jquery不能实现3d动画;2、css的2d矩阵动画效率较高,其他属性动画效率低,jquery利用margin和left、top模拟的矩阵动画效率低,其他属性动画效率高。

See all articles See all articles

Hot Tools

jQuery2019情人节表白放烟花动画特效

jQuery2019情人节表白放烟花动画特效

一款抖音上很火的jQuery情人节表白放烟花动画特效,适合程序员、技术宅用来向心爱的姑娘表白,无论你选择愿意还是不愿意,到最后都得同意。

layui响应式动画登录界面模板

layui响应式动画登录界面模板

layui响应式动画登录界面模板

520情人节表白网页动画特效

520情人节表白网页动画特效

jQuery情人节表白动画、520表白背景动画

炫酷的系统登录页

炫酷的系统登录页

炫酷的系统登录页

HTML5磁带音乐播放器-CASSETTE PLAYER

HTML5磁带音乐播放器-CASSETTE PLAYER

HTML5磁带音乐播放器-CASSETTE PLAYER