以前做Ajax博客的时候比较喜欢的一个加载效果
其中用过中间的gif图也有纯css3效果
但是比较喜欢这个进度条效果,
类似 Google YouTube各大网站的顶部进度条效果
能反馈完整网页加载进度
于是谷歌到了这个作者的这款Js

NProgress 顶部进度条

可用于Pjax 与 Ajax 灵感来源于Google YouTube 和 Medium

安装:

上传文件添加到页面 nprogress.js nprogress.css
<script src='nprogress.js'></script>
<link rel='stylesheet' href='nprogress.css'/>


用法:

只需调用start()和done()到进度条控制。
NProgress.start();
NProgress.done();


高级用法:

进度条百分比:.set(n)
NProgress.set(0.0); // 0
NProgress.set(0.4); // 40%
NProgress.set(1.0); // 100%

进度条增加:.inc() 进度条将渐进增加
NProgress.inc();
如果你想增加一个特定的值，可以增加一个参数：
NProgress.inc(0.2);
将得到当前状态值增加0.2到状态0.994