当前位置:JS特效 » 其他 » 简单的jquery进度条插件
 简单的jquery进度条插件
如果您觉得内容不错,请分享:
标签: 进度条兼容ie8

插件介绍

LineProgressbar.js是一款最简单的jquery进度条插件。通过LineProgressbar.js可以创建带动画效果的线性进度条,你可以配置进度条的颜色,高度,圆角等属性。

浏览器兼容性

浏览器兼容性
时间:2021-07-24 阅读:81
简要教程

LineProgressbar.js是一款最简单的jquery进度条插件。通过LineProgressbar.js可以创建带动画效果的线性进度条,你可以配置进度条的颜色,高度,圆角等属性。

使用方法

在页面中引入jquery.lineProgressbar.css和jquery.lineProgressbar.js文件。


        
                
HTML结构

使用一个

作为进度条的容器。

初始化插件

在页面DOM元素加载完毕之后,通过下LineProgressbar()方法来初始化该jquery进度条插件。

$('#progressbar1').LineProgressbar();           
                

配置参数

LineProgressbar.js进度条插件的可用配置参数有:

参数 类型 默认值 描述
percentage int null 定义进度条的百分比数。
ShowProgressCount boolean true 定义是否显示百分比数值。
duration int 1000 定义进度条动画的速度。默认为1000毫秒。可以使用整数值孟获关键字:slowfast
fillBackgroundColor string '#3498db' 定义进度条的背景填充色。
backgroundColor string '#EEEEEE' 定义进度条的背景色。
radius string '0px' 定义进度条的圆角。
height string '10px' 定义进度条的高度。
width string '100%' 定义进度条的宽度。

LineProgressbar.js进度条插件的github地址为:https://github.com/kingRayhan/LineProgressbar

Top