Indicates a running process where the progress is unknown using an animated svg. ex: AJAX form submission. Simply wrap .progress-bar-indeterminate with Bootstrap's .progress. The progress bar will automatically expand to get the width of its parent <div>
Animation in progress
1
<divstyle="width:50%">
2
<divclass="progress">
3
<divclass="progress-bar-indeterminate"></div>
4
</div>
5
</div>
6
</div>
Copied!
Color options
In addition to Bootstrap's contextual progress bar classes, Pages has introduced two new classes, .progress-bar-successand .progress-bar-complete if you want to add more color to your project
Don't like the linear style? Try circular progress indicators instead. These also come with determinate and inderminate options
Indeterminate progress
Animation in progress
1
<divclass="progress-circle-indeterminate"></div>
Copied!
Determinate progress
A determinate circular progress indicator can be initialized without writing a single line of Javascript code by simply including markup below. Pass any percentage value (0-100) into the value field to set the progress