很多网站使用了Pjax无刷新加载 顶部没有页面加载进度,为了美观丶流畅感觉可以加进去,分享写个教程给大家
首先创建一个js文件引入(把以下js代码放进去)
注意:引入到jquery.js的下面
JS代码
在创建一个css文件 引入
把以下css代码放进去)
#nprogress{pointer-events:none}
#nprogress .bar{background:#73aaff;position:fixed;z-index:99999;top:0;left:0;width:100%;height:2px;}
#nprogress .peg{display:block;position:absolute;right:0;width:100px;height:100%;opacity:1;transform:rotate(3deg) translate(0,-4px);}
最后加入pjax 重载函数
$(document).on('pjax:send', function() {
NProgress.start()
});
$(document).on("pjax:complete", function () {
NProgress.done();
});
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END
- 最新
- 最热
只看作者