ProgressBar ProgressBar is a process status indicator.

Dynamic

Static

$('#default').puiprogressbar();
                                
<div id="default" />
                                
Name Type Default Description
value number 0 Progress Bar value
labelTemplate string {value}% Progress Bar label template
showLabel boolean true Shows label on ProgressBar
easing string swing Optional easing to use in animation.
effectSpeed int/string normal Speed in milliseconds or keywords like slow, normal and fast.
Name Parameters Description
complete event: puiprogressbarcomplete event Fired when value equals 100

Example

$('#default').puiprogressbar({
    complete: function(event) {
        //...
    }
});
                                
Name Parameters Description
option name: Name of the option Returns the value of the option.
option name: Name of the option, value: Value of the option Set the value of the option.
$(function() {
     $('#pb1').puiprogressbar();

     $('#pb2').puiprogressbar({
          value: 50
     });                

     setInterval(function() {
          var val = $('#pb1').puiprogressbar('option', 'value') + 10;
          $('#pb1').puiprogressbar('option', 'value', val);
     }, 1000);
}); 
                                
<div id="pb1"></div>

<div id="pb2"></div>