jQuery基于数字滚动插件制作,蓝色的建站公司网站页面滚动,项目统计数字累加和页脚快速导航布局样式代码。这是一款简洁大气的页面底部样式代码。
[声明] 墨鱼部落格所有资源为用户免费分享产生,若发现您的权利被侵害,请点击后方链接查看并联系我们,我们尽快处理。免责声明|侵权处理流程
使用方法:
1、head引入css文件
<link rel="stylesheet" type="text/css" href="statics/css/style.css" />
2、head引入js文件
<script src="statics/js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
3、body引入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-000-0000</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 src="statics/js/count.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> /* 参数 target = 目标元素的 ID; startVal = 开始值; endVal = 结束值; decimals = 小数位数,默认值是0; duration = 动画延迟秒数,默认值是2; 具体用法参考:http://inorganik.github.io/countUp.js/ */ 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>
文件目录
本资源来自:代码 » DIV|CSS » 蓝色的建站网站页脚布局代码
注:此资源非帝国CMS模板/特效/源码,需要帝国CMS整站模板源码的小伙伴,请移步 帝国CMS模板,感谢支持!
商城系统页脚设计代码
« 上一篇
2020年12月05日
通用的网页底部导航div布局代码
下一篇 »
2020年12月05日
1、如非特殊说明,本站对本文提供的代码或者素材不拥有任何权利,其版权归原著者拥有。
2、以上提供的代码或者素材均为作者提供和网友推荐收集整理而来,仅供学习和研究使用。
3、如有侵犯你版权的,请来信(邮箱:48444431@qq.com)指出,核实后,本站将立即改正。
4、如有链接无法下载、失效或广告,请点击下面的报错或者联系墨鱼处理!
5、以上资源售价只是赞助,不代表代码或者素材本身价格。收取费用仅维持本站的服务器开销!
6、如无特殊说明,如:织梦或者帝国等开源CMS核心模板,那么默认提供的只是HTML模板!
7、所有代码素材效果均为演示打包,最终效果请参考演示效果,本站不提供任何技术支持和服务。
8、代码素材均为虚拟物品,演示和描述无错的情况下,无法进行退换服务。
2、以上提供的代码或者素材均为作者提供和网友推荐收集整理而来,仅供学习和研究使用。
3、如有侵犯你版权的,请来信(邮箱:48444431@qq.com)指出,核实后,本站将立即改正。
4、如有链接无法下载、失效或广告,请点击下面的报错或者联系墨鱼处理!
5、以上资源售价只是赞助,不代表代码或者素材本身价格。收取费用仅维持本站的服务器开销!
6、如无特殊说明,如:织梦或者帝国等开源CMS核心模板,那么默认提供的只是HTML模板!
7、所有代码素材效果均为演示打包,最终效果请参考演示效果,本站不提供任何技术支持和服务。
8、代码素材均为虚拟物品,演示和描述无错的情况下,无法进行退换服务。