风来自远方 相爱的人总会相逢
蜀ICP备15021793号-2自豪地使用 Typecho 建站搭配使用 🌻Sunny 主题当前在线 1 人
歌曲封面 未知作品

蜀ICP备15021793号-2

网站已运行 3 年 323 天 1 小时 27 分

Powered by Typecho & Sunny

2 online · 27 ms

Title

NProgress 一个好康的进度条

Quite

·

Article
⚠️ 本文最后更新于2020年12月22日,已经过了1299天没有更新,若内容或图片失效,请留言反馈
请输入图片描述
搬自:https://www.catct.cn/archives/674.html

1.下载

官网下载地址:https://ricostacruz.com/nprogress/

GitHub项目地址:https://github.com/rstacruz/nprogress/

2.引入需要的 nprogress.css 和 nprogress.js 文件

请输入图片描述♾️ js 代码:
<link rel="stylesheet" type="text/css" href="nprogress.css"/>
<script src="nprogress.js"></script>

3. 基本用法:只需要调用NProgress的 start() 和 done() 的API来控制进度条

♾️ js 代码:
NProgress.start();
NProgress.done();

可以通过调用 .set(n)来设置进度,n是0-1的数字。

♾️ js 代码:
NProgress.set(0.0);     // Sorta same as .start()
NProgress.set(0.4);
NProgress.set(1.0);     // Sorta same as .done()

可以使用inc()随机增长进度条。

♾️ js 代码:
NProgress.inc();

通过使用done()让进度条关闭。

♾️ js 代码:
NProgress.done(true);

Pjax

♾️ js 代码:
$(document).on('pjax:start', function() { NProgress.start(); });
$(document).on('pjax:end',   function() { NProgress.done();  });
现在已有 1 条评论,3 人点赞
Comment
发表
  1. 头像
    @
    Cat
    你是不是标错来源了 :@(中枪)
    · Windows · Chrome

    👍

    💖

    💯

    💦

    😄

    🪙

    👍 0 💖 0 💯 0 💦 0 😄 0 🪙 0
搜 索 消 息 足 迹
你还不曾留言过..
你还不曾留下足迹..
博主