Vanilla by Plus Three
An Advanced, Flexible Front-End Development System
Home / Components

Horizontal Progress Bar

Notes

Please view source to see sample CSS and JS code. Because of the nature of this component, there are no defaults in the vanilla assets except for the progress bar color, which is @primaryButtonColor.

The JS function has the following options:

  • direction: 'horizontal' or 'vertical'. Defaults to 'horizontal'.
  • value: An integer, from 0 - 100, to determine the length of the bar.
  • animSpeed: The time it takes the bar to be drawn. Defaults to 'slow' (600 milliseconds).