jQuery 数字滚动特效代码下载



如需定制开发(网站开发、二次开发)在线咨询,请点击>> QQ:753511799

16 61 21



特效描述:数字滚动。jQuery基于数字滚动插件制作,黑色的建站公司网站页面滚动,项目统计数字累加和页脚快速导航布局样式代码。这是一款简洁大气的页面底部样式代码。

代码结构

1. 引入CSS

<link rel="stylesheet" type="text/css" href="statics/css/style.css" />

2. 引入JS

<script src="statics/js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
<script src="statics/js/count.js" type="text/javascript" charset="utf-8"></script>

3. HTML代码

<div class="product-number-info" id="productNumber">
	<div class="product-number-inner">
		<ul class="q">
			<li class="li-1"><b><i id="productNumber_1" data-sum="1760093">0</i><sup>+</sup></b>
				<p>公司优选</p>
			</li>
			<li class="li-2"><b><i id="productNumber_2" data-sum="3687">0</i><em>天</em></b>
				<p>安全运行</p>
			</li>
			<li class="li-3"><b><i id="productNumber_3" data-sum="150">0</i><sup>+</sup></b>
				<p>覆盖行业和类目</p>
			</li>
			<li class="li-4"><b><i id="productNumber_4" data-sum="1429">0</i><em>万</em></b>
				<p>件商品销售中</p>
			</li>
			<li class="li-5"><b><i id="productNumber_5" data-sum="3460990">0</i><sup>+</sup></b>
				<p>个订单为企业带来</p>
			</li>
		</ul>
	</div>
</div>
<div class="copyright">
	<div class="copyright_c">
		<div class="copyright_head">
			<div class="copyright_L">
				<p><img src="statics/images/logo.png" /></p>
				<span>
			<em>服务时间:</em>
			<em>周一至周日  9:00-18:00</em>
		</span>
				<span>
			<em>客服电话:</em>
			<strong>4000-888-8888</strong>
		</span>
				<span>
			<em>客服QQ:</em>
			<a href="#" >在线交谈</a>
		</span>
			</div>
			<div class="copyright_C">
				<div class="copyright_C_list">
					<p>关于我们</p>
					<div class="about">
						<a href="#">公司简介</a>
					</div>
					<div class="about">
						<a href="#">知识产权</a>
					</div>
					<div class="about">
						<a href="#">联系我们</a>
					</div>
				</div>
				<div class="copyright_C_list">
					<p>产品服务</p>
					<div class="about">
						<a href="#">云官网</a>
						<a href="#">云商城</a>
					</div>
					<div class="about">
						<a href="#">云分销</a>
						<a href="#">微圈儿</a>
					</div>
					<div class="about">
						<a href="#">小程序</a>
						<a href="#">小程序加盟</a>
					</div>
				</div>
				<div class="copyright_C_list">
					<p>建站学院</p>
					<div class="about">
						<a href="#">服务市场</a>
						<a href="#">城市建站</a>
					</div>
					<div class="about">
						<a href="#">帮助中心</a>
						<a href="#">快递查询</a>
					</div>
					<div class="about">
						<a href="#">建站学院</a>
					</div>
				</div>
			</div>
			<div class="copyright_R">
				<span><img src="statics/images/ewm1.jpg"  /></span>
				<p>扫描关注微信公众号</p>
			</div>
		</div>
		<div class="copyright_bottom">
			<span>陕西B2-xxxxxxx 陕西网安备1101080xxxxxxx号 陕ICP备xxxxxxxx号-32   </span>
			<p>建站创建能为您带去订单的网站</p>
		</div>
	</div>
</div>
<!--数字滚动插件countUp-->
<script type="text/javascript">
productNumber=function (){
	var arr = [];
	$('#productNumber li').each(function(i, dom) {
		var iDom = $(dom).find('i'),
			decimals = 0,
			sum = iDom.data('sum');
		//初始化传参,参数为上面注释中的参数    
		arr.push(new CountUp(iDom.attr('id'), 0, sum, decimals, 4, {
			useEasing: true,//效果
			separator: ''//数字分隔符
		}));
		arr[i].start();
	});
}();			
</script>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册



×
×
51前端

注册

×
绑定手机

请绑定手机号,在继续操作

×
单次下载支付

应付金额:279

支付完成后,回到下载页面,在进行下载

官方QQ群
意见反馈
qq群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到