码迷,mamicode.com
首页 > 编程语言 > 详细

利用原生javascript实现进度条(可做页面头部进度条,或者局部进度条均可)

时间:2017-06-07 12:46:15      阅读:192      评论:0      收藏:0      [点我收藏+]

标签:onload   一句话   方法   type   效果   tar   使用方法   表示   参数   

 1 <div class="top-progress" id="js-top-progress"></div> <!--结构只有一句话即可-->
 2 <script src="./static/js/progress.js"></script>
 3 <script type="text/javascript">
 4   var p = myProgress.create(document.getElementById("#js-top-progress"), "#21a557", false); 
//第一个参数必须为原生dom对象
   //第二个参数为进度条的颜色
5 //第三个参数默认为true,表示进度条走完是否还显示 6 p.start(); //进度条开始走 7 8 window.onload = function() { 9 p.over(); //页面加载完毕,调用,让进度条走完到100% 10 } 11 </script>

今天闲来无事,实现了一下现在常见的页面头部的载入进度条,上面就是使用方法,很简单的几句话,有需要的朋友可以拿去。

代码效果可以去我的这个页面查看 http://www.bx1987.com/edu/

源码可以去这里下载

https://github.com/blff122620/jsLibary/blob/master/static/js/progress.js

利用原生javascript实现进度条(可做页面头部进度条,或者局部进度条均可)

标签:onload   一句话   方法   type   效果   tar   使用方法   表示   参数   

原文地址:http://www.cnblogs.com/beau30/p/6956002.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!