简介
YprogressBar是一个基于HTML5的进度条插件。
YprogressBar是一个轻量级的进度条插件,使用方便,占用资源少,模仿压敏解压界面,有数字显示。它还支持在描述中添加参数,以动态显示更详细的执行信息,如上传速度和剩余时间。
YprogressBar代码编写简单,结构设计合理,不会给你的系统带来不良影响。
界面预览
说明
文件访问
只需参考yprogressbar.css和yprogressbar.js文件。
用法概述
varypb=new yprogressbar({ title : '正在上载文件.',des: '上传速度:{{y:speed}}MB/秒,剩余时间约为{{y:second}}秒',可关闭3360 true,cancelcalcallback 3360 function(rate)console . log(vars);} });ypb . show();实例参数描述
为了展示面向对象的力量,如果你想使用YprogressBar,你必须实例化它。当实例化它时,您需要一些参数,这些参数总体上是一个对象。具体参数将逐一说明。
标题
进度条的标题,说明这个进度条是干什么用的。
数据加密标准
给一个更详细的做什么的描述,就可以直接写句子了。
有时候我们想做一些花样,比如显示上传速度,剩余时间等等。YprogressBar完全支持你这样做,只需在描述中添加变量,格式为{{y:name}}。
例如,des: '上传速度:{{y:speed}}MB/s,剩余时间约为{{y:second}}秒',其中{{y:speed}}和{{y:second}}为变量。
如果在此指定了变量,则在执行更新操作时,必须在第二个参数中指定变量值。
可关闭的
破坏回调。一旦YprogressBar被销毁,无论是手动调用销毁方法还是用户点击关闭按钮,都会触发这个回调。
当回调被触发时,会传入两个参数,即当前执行进度和此刻描述中的参数值(对象包含名称和值)。
显示方法
不需要参数。
在调用show方法之前,进度条不会显示。
更新方法
更新进度,两个参数。
第一个参数是当前进度,直接用数字表示,例如:26,表示26%。
第二个参数是一个对象,它需要包含描述中所有变量的值。如果描述中没有变量,可以忽略该参数。
例如:
ypb.update(26,{ speed: 312,second : 5 });破坏方法
销毁进度条,释放内存。
关于Github的看法
以上就是本文的全部内容,希望大家喜欢。