Jquery 进度条中的多段？

我在一个进度条jQuery插件中寻找多段

每个片段可以有不同的宽度和不同的背景颜色

我在找这样的东西：

我已经厌倦了谷歌搜索，我找不到任何支持多段的jquery进度条插件

---

该插件存在吗？

使用jquery ui，您可以在.ui progressbar值内创建段

$( "#progressbar" ).progressbar({
  value: 0,
  create: function( event, ui ) {
      var progress=$(this);
      var progressvalue=progress.children(".ui-progressbar-value");
      progressvalue.css("overflow","hidden");
      var wrapper=$("<div>");
      wrapper.css({"width":progress.width(),"height":"100%","display":"block"});
      progressvalue.append(wrapper);         
      var segment=$("<span>");
      segment.css({"width":"20%","height":"100%","display":"block","background":"#aa0000","float":"left"});
      wrapper.append(segment);
      segment=$("<span>");
     segment.css({"width":"50%","height":"100%","display":"block","background":"#00aa00","float":"left"});
      wrapper.append(segment);
  }
});    

$（“#progressbar”）.progressbar({
值：0，
创建：函数（事件、用户界面）{
var progress=$（此项）；
var progressvalue=progress.children（“.ui progressbar值”）；
css（“溢出”、“隐藏”）；
变量包装器=$（“”）；
css（{“width”：progress.width（），“height”：“100%”，“display”：“block”}）；
progressvalue.append（包装器）；
变量段=$（“”）；
css（{“宽度”：“20%”，“高度”：“100%”，“显示”：“块”，“背景”：“#aa0000”，“浮动”：“左”}）；
附加（段）；
段=$（“”）；
css（{“宽度”：“50%”，“高度”：“100%”，“显示”：“块”，“背景”：“00aa00”，“浮动”：“左”}）；
附加（段）；
}
});