网站建设余杭:如何使用Pace.js创建JavaScript进度栏

2019.01.15

990

网站建设余杭

在今天的教程中,我将向您展示如网站建设余杭何使用这个神奇的插件在您的站点上加载一个进度条。

查看演示


  • 您可以在网站中的任何网页中自动加载进度条。
  • 它有14个内置的主题(在撰写本文时),您可以从中选择。
  • 自动检测进度。

完成本教程所需的资源

  • 任何背景图像

太简单了!从这里开始!

js非常容易实现。您只需将和您选择的主题CSS包含在头部部分,就可以完成了。不需要添加jQuery库就可以工作了!




	
	Create your own page load progress bar with 
	
	

Configuration

虽然是全自动的,但不需要配置就可以工作。你可以在上面做些调整。

有两种方法:

1.在导入文件之前设置网站建设余杭window.paceOptions:

paceOptions = {
  // Disable the 'elements' source
  elements: false,

  // Only show the progress on regular and ajax-y page navigation,
  // not every request
  restartOnRequestAfter: false
}

2.将选项放在脚本标记上:


您网站建设余杭还可以更改主题的颜色。有两种方法可以做到这一点:

包起来

给你!太简单了不是吗?

js是一个很棒的JavaScript插件,它附带了很多主题。还有其他一些jQuery插件,如ProBars:jQuery动画网站建设余杭进度条和Progress.js。

但是对我来说,是最好的插件,因为它是一个即插即用插件,不需要配置。让我知道你的想法,关于这个插件在评论部分。

关键词

最新案例