pace.js页面加载进度条插件

本文简要介绍了插件pace.js

在页面中引入Pace.js，页面会自动监控你的请求(包括Ajax请求)。如果事件周期滞后，加载状态和进度将记录在页面上。这个插件兼容IE8以上所有主流插件，它的强大之处在于还可以引入加载进度条的主题风格，可以选择任意颜色和各种动画效果(如simple、flash、MAC OSX、左填充、上填充、counter和bounce等)。).如果你擅长修改css动画，你可以制作出无限可能的动画，并为你的网站添加个性化的功能！

调用方法：

介绍Pace.js和主题文件：

head script src=' http :/pace/pace . js '/script link href='/pace/themes/pace-theme-barber-shop . CSS ' rel='样式表'/head自定义配置：

Pace.js会自动加载到页面中，并且会自动检测进度，无需任何代码。如果您想进行一些调整，您可以设置window.paceOptions来自定义配置：

paceOptions={//Disable ' elements ' source elements 3360 false，//仅显示常规和ajax-y页面导航的进度，//不是每个请求都在： false后重新启动请求}您也可以将自定义设置放在脚本标签中，例如：

脚本数据-pace-options=' { ' Ajax ' : false } ' src=' pace . js '/脚本如果使用AMD或Browserify加载模块，可以这样设置(例如：start):

define(['pace']，function(pace){ pace . start({ document : false })；});使用API:

Pace.js公开的API列表：

开始：开始显示进度条。如果您不使用AMD或Browserify加载模块，这将默认执行。

Pace.restart:进度条被重新加载并显示。

Pace.stop:隐藏进度条并停止加载。

Pace.track:监视一个或多个请求的任务。

Pace.ignore:忽略一个或多个请求的任务。

基本上这些都是一般的使用方法，还有其他的使用方法，所以大家会去官网看更详细的介绍。希望这个插件能帮到大家！