nprogress.js 头部进度条

引入CSS\JS

<link rel="stylesheet" type="text/css" href="Style/nprogress.css">

<script type="text/javascript" src="JavaScript/nprogress.js"></script>

调用方法：

//开始执行

NProgress.start();

//到40%的位置

NProgress.set(0.4);

//前进一部分

NProgress.inc();

//结束

NProgress.done();

文档手册：http://amazeui.org/1.x/javascript/nprogress/

演示网址：http://ricostacruz.com/nprogress/

nprogress.js 头部进度条使用方法的更多相关文章

  1. 【CSS系列】网页头部进度条方式一

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. js 实现进度条功能。

    /** * 纯js进度条 * Created by kiner on 15/3/22. */ function progress(options){ this.w = (options &&a ...

  3. 模仿也是提高，纯css小技巧实现头部进度条

    刚开始的时候我也觉得不可能,但是就是这么神奇,总有大神给你意想不到的惊喜. 快来感受一下把.(仔细看看头部黄色条的变化) 思考一下啊,怎么出现的那,其实作者使用了一点小技巧,那就是背景色渐变和遮挡产生 ...

  4. Js 百分比进度条

    [构想] CSS3 + JS CSS3控制进度 利用CSS3中的 @keyframes JS实现百分比 根据CSS来调整,时间 [页面代码] 第一种: 默认直接进入就是下载 CSS代码 body { ...

  5. js实现进度条效果

    需求分析: 最近学习javascript客户端脚本语言,学到了两个定时器函数setInterval()和setTimeout(),回想起以前在网页上看到的进度条效果可以使用定时器来实现,所以完成了进度 ...

  6. 拼接html不显示layui进度条解决方法

    最新有个新需求,要异步拼接html并渲染数据,并且我这边是用layui的flow.load(流加载)渲染多个进度条.按官网给出的 element.progress('demo', n+'%'); 就是 ...

  7. js控制进度条到达100%跳转界面一

    进度条一般在手机上用到的比较广泛,刚好最近的项目也是一直在做手机站,这个特效是手机端的一个界面,现在我把改成pc端了,进度条的快慢速度和样式可自行调节,改动也是很方便的,不多说,看代码: <st ...

  8. js实现进度条

    不多说,直接上代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  9. JS实现 进度条 不用控件

    demo1 <html> <head> <title>进度条</title> <style type="text/css"&g ...

随机推荐

  1. iOS8下注冊push方式变更

    if (IOS8_) { UIUserNotificationSettings *settings = [UIUserNotificationSettings settingsForTypes:(UI ...

  2. 复制相关参数学习笔记--master上的参数

    特别声明: 所有的过滤规则不建议在主库上设置.     server_id 是一个整数,范围:1 至 power(2,32)-1 之间. 推荐使用端口号+ip最后一位的方式. 唯一区别ID,同一个集群 ...

  3. Scrapy系列教程（1）------命令行工具

    默认的Scrapy项目结构 在開始对命令行工具以及子命令的探索前,让我们首先了解一下Scrapy的项目的文件夹结构. 尽管能够被改动,但全部的Scrapy项目默认有类似于下边的文件结构: scrapy ...

  4. [iOS]iOS开发人员账号申请与注冊流程

    郝萌主倾心贡献,尊重作者的劳动成果,请勿转载. 假设文章对您有所帮助,欢迎给作者捐赠,支持郝萌主,捐赠数额任意.重在心意^_^ 我要捐赠: 点击捐赠 Cocos2d-X源代码下载:点我传送 游戏官方下 ...

  5. ANR触发原理

    ANR(Application Not responding),是指应用程序未响应,Android系统对于一些事件需要在一定的时间范围内完成,如果超过预定时间能未能得到有效响应或者响应时间过长,都会造 ...

  6. NOIP模拟1717 总结

    总结 T1: 有x个人在a时b分来,c时d分离开,求所有时刻中人数的最大值. 差分裸题,当然也可以写线段树. 第一题一般来说思维都不会太复杂,如果打的时间很长,便要调整自己的思路,要保证A掉. T2: ...

  7. 我为什么要写FansUnion个人官网-BriefCMS-电子商务malling等系统

    不少朋友一直关注我最近几个月,已经做的和正在做的项目,比如个人官网.BriefCMS.电子上午malling等系统. 但是呢,部分朋友比较好奇,为啥要去写.他们比较疑惑的是,市面上已经有很多类似的系统 ...

  8. 增删改查 T-SQL最基本操作

    use test --操作test表 go --查询 select * from stu -- 查询stu里的所有数据 select top 3 * from stu -- 查询stu里前三行数据 s ...

  9. ART、JIT、AOT、Dalvik之间有什么关系？

    JIT与Dalvik JIT是"Just In Time Compiler"的缩写,就是"即时编译技术",与Dalvik虚拟机相关. 怎么理解这句话呢?这要从A ...

  10. Python 第三方库 cp27、cp35 等文件名的含义

    What does version name 'cp27' or 'cp35' mean in Python? 如对于 gensim-0.12.4-cp27-none-win_amd64.whl文件名 ...