PHP群:95885625 Hbuilder+MUI群:81989597 站长QQ:634381967
    您现在的位置: 首页 > JS特效 > 其它特效 > 正文

    jQuery进度条插件

    作者:admin来源:clarkfbar 浏览:时间:2015-08-13 17:50:21我要评论
    分享到

    内容介绍

    参数支持//b5.mxunkeji.com
    var settings = {
          width: 90, // 进度条宽度
          height: 20, // 进度条高度
          percent: 0, // 当前占比
          backgroundColor: '#555', // 进度条背景颜色
          barColor: '#d9534f', // 进度条颜色
          radius: 4, // 边角圆度
          fontSize: 12, // 字体大小
          increaseTime: 1000.00/60.00, // 每一次调整进度条的时间, 默认最佳时间(可以调大,不要调小);只有在animate为true的情况下有效
          increaseSpeed: 1, // 每次调整,增长速度;只有在animate为true的情况下有效
          animate: true // 调整的时候,是否使用动画增长,默认为true
        };
    我提供了一个动画的开关,因为当上传文件小的时候,animate的动画方法是完全没有必要的~

    初始化插件:
    1. 引入插件和jquery

    2. 在页面要放入进度条的地方,放如一个svg:

    <svg id="svg"></svg>
    3. 调用插件:

    var progress = $("#svg").Progress({
            percent: 20,
            width: 180,
            height: 40,
            fontSize: 16
          });
    4. 如果要修改进度

    progress.percent(90); // 修改进度条占比,并返回当前值。如果参数为空,返回当前值
    下载资源:158 下载积分:0 积分
    转载请注明(B5教程网)原文链接:https://b5.mxunkeji.com/content-73-543-1.html
    相关热词搜索: