网页头部页面加载进度条插件-NProgress
原创    bluesky    发表于:2018-01-10 15:10:13
  阅读 :1.0k+   收藏   编辑

插件地址:http://ricostacruz.com/nprogress/
GitHub :https://github.com/rstacruz/nprogress/

该插件依赖 jquery

简介

轻量级的ajax进度条应用,灵感来自Google, YouTube, and Medium。

  • 页面引入css,js
<script src='nprogress.js'></script>
<link rel='stylesheet' href='nprogress.css'/>
  • 在页面中有 Ajax 请求中添加进度条,绑定到 Zepto(jQuery) ajaxStart 和 ajaxStop 事件中。
$(document).bind("ajaxStart", function() {NProgress.start();});
$(document).bind("ajaxStop", function(){NProgress.done();});
  • 在页面中没有 Ajax 请求中
$(document).ready(function(){  
    NProgress.start();  
  });  
$(window).load(function(){  
    NProgress.done();  
});
评论
条评论