layui 进度条 设置刻度

注意进度条依赖 element 模块,否则无法进行正常渲染和功能性操作

<div class="layui-progress layui-progress-big" lay-showpercent="true" lay-filter="number">
  <div class="layui-progress-bar layui-bg-red" lay-percent="0%" id="number"></div>
</div>
//动态效果 进度条
layui.use(['table','element','form','laydate'], function(){
  var element = layui.element;
  
  	  //模拟loading
  	  //进度条 加载效果
      var n = 49; //进度条的刻度
      var b = 0; //加载效果使用
      var timer = setInterval(function(){
        b++;
        if(b == n){
          clearInterval(timer);
        }
        element.progress('number', b+'%');
      }, 100); // 200是进度条加载速度
});

//直接设置进度条

$("#number").attr("lay-percent","35%");
发布了72 篇原创文章 · 获赞 3 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/tanqingfu1/article/details/103906329
今日推荐