NProgress.js的简单使用

说明
获取
简单使用

说明

这东西依赖jquery

获取

CDN方式

https://unpkg.com/nprogress@0.2.0/nprogress.js
https://unpkg.com/nprogress@0.2.0/nprogress.css

npm方式

npm install nprogress

简单使用

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>NProgress的使用</title><link rel="stylesheet" href="https://unpkg.com/nprogress@0.2.0/nprogress.css"><script src="https://cdn.bootcss.com/jquery/2.1.0/jquery.min.js"></script><script src="https://unpkg.com/nprogress@0.2.0/nprogress.js"></script>
</head>
<body><script>$(function() {NProgress.start();　　$(window).load(function() {NProgress.done();})})
</script>
</body>
</html>

配合ajax

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>NProgress的使用</title><link rel="stylesheet" href="https://unpkg.com/nprogress@0.2.0/nprogress.css"><script src="https://cdn.bootcss.com/jquery/2.1.0/jquery.min.js"></script><script src="https://unpkg.com/nprogress@0.2.0/nprogress.js"></script>
</head>
<body><script>
$(window).ajaxStart(function () {NProgress.start();
});
$(window).ajaxStop(function () {NProgress.done();
});
</script>
</body>
</html>

学习资源推荐：https://blog.csdn.net/qq_42813491/article/details/90213353

NProgress.js的简单使用相关推荐

游戏开发：js实现简单的板球游戏
js实现简单的板球游戏大家好,本次我们来使用js来实现一个简单的板球游戏.截图如下: 首先,设计页面代码,页面代码很简单,因为整个几乎是使用js编写的,页面几乎没有代码,如下: <!DOCTY ...
js html css淘宝足迹日历效果,js实现简单的日历显示效果函数示例
本文实例讲述了js实现简单的日历显示效果函数.分享给大家供大家参考,具体如下: 用一个函数简单的实现一个月份的日历,效果如下: 这个日历效果有高亮显示,我实现的思维比较简单. 我把上面的日历效果用表格 ...
js实现简单的循环打字效果(思路分享)
1.初始化"打字创建"属性代码类似于这样: <div id="demo"></div> <script>var typin ...
nprogress.js 头部进度条使用方法
nprogress.js 头部进度条引入CSS\JS <link rel="stylesheet" type="text/css" href=" ...
php简单网页制作代码,用HTML和CSS以及JS制作简单的网页菜单界面的代码
这篇文章主要介绍了使用HTML+CSS+JS制作简单的网页菜单界面,这个ABROAD项目所使用的JavaScript部分代码非常简单,需要的朋友可以参考下写ABROAD项目用到了标签这个东东,其实标 ...
JS函数简单的底层原理 -变量重复声明无效，隐式申明，变量提升，函数提升，以及堆栈内存的变化
JS函数简单的底层原理 (个人理解): 1. 已经使用var申明且赋值,若再次申明,则第二次申明(不赋值)无效. 2.在同一个作用域下,只要是发生了同名,且变量完成赋值,后者会覆盖前者.存在两个相同的 ...
python跑酷游戏源码_Phaser.js实现简单的跑酷游戏附源码下载
采用的物理引擎是Phaser.js 在这里对此引擎不做过多介绍(因为我也是小白,嘿嘿) 效果展示: 源码(详细源码图片资源可点击文章下方或屏幕右上方的github链接进行clone) 1.创建游戏舞台 ...
好程序员前端分享使用JS开发简单的音乐播放器
好程序员前端分享使用JS开发简单的音乐播放器,最近,我们在教学生使用JavaScript,今天就带大家开发一款简单的音乐播放器.首先,最终效果如图所示: 首先,我们来编写html界面index.htm ...
java喷泉编码_好程序员Java教程分享使用JS实现简单喷泉效果
原标题:好程序员Java教程分享使用JS实现简单喷泉效果好程序员Java教程分享使用JS实现简单喷泉效果,最近,在教学生使用JS的基本操作,为了练习JS的基本作用,特地写了一个喷泉效果,代码如下: ...

NProgress.js的简单使用

NProgress.js的简单使用

说明

获取

简单使用

NProgress.js的简单使用相关推荐

最新文章

热门文章