the-muda-organization / nanobar
超轻量级、纯JavaScript页面加载进度条
v1.0.0
2020-10-19 03:59 UTC
This package is auto-updated.
Last update: 2024-09-29 05:42:26 UTC
README
超轻量级、纯JavaScript页面加载进度条
状态
预览
目录
快速开始
有几种选项可供选择
- 下载最新版本。
- 克隆仓库:
git clone https://github.com/the-muda-organization/nanobar.git - 使用 Composer 安装:
composer require the-muda-organization/nanobar
包含内容
在下载中,您将找到以下目录和文件,逻辑上组织常见资产,并提供编译和压缩版本。您将看到如下内容
nanobar/
│
└─ dist/
│
├── nanobar.js
└── nanobar.min.js
错误和功能请求
有错误或功能请求?在打开新问题之前,请搜索现有和已关闭的问题。如果您的错误或想法尚未得到解决,请打开新问题。
安装
- 下载并复制文件到您的项目
- 将JS添加到您的项目
<script src="https://example.com/nanobar/1.x.x/nanobar.min.js"></script>
或添加内联脚本(推荐)
<script>Paste script here</script>
- 将nanobar
<script>放在<body>标签之后。 - 立即使用!
如何使用
Nanobar旨在放置在CDN上并在多个页面上使用。Nanobar的默认背景颜色设置为红色。您可以在JavaScript变量(脚本开始处)中设置您最喜欢的自定义背景颜色。
如果您想在一个页面上更改颜色,请向 <body> 添加 data-nanobar="" 属性。您可以使用CSS中通常使用的任何颜色值(#nanobar{background: something} - 颜色名称,十六进制值,渐变等)。
<body data-nanobar="#ff8c00"> <body data-nanobar="blue"> <body data-nanobar="linear-gradient(to right,#40e0d0,#ff8c00,#ff0080)">
如果您不想更改背景颜色,请不要添加此属性并留空。JavaScript会检查是否有新的背景颜色值
data-nanobar="#ff8c00"。
Nanobar已分配ID: <div id="nanobar"></div>
版本控制
Nanobar将在尽可能多的程度上遵循语义版本控制指南。版本号将按以下格式编号: <major>.<minor>.<patch>
变更日志
有关最新版本,请参阅详细的变更日志。
团队
行为准则
如果你表现得很好,我们会表现得很好。有关更多详细信息,请参阅我们的行为准则。
版权和许可
代码和文档版权所有 2017-2020 The MUDA Organization。
代码在MIT许可下发布。
