Indicate progress a little bit different.
Progress icons
All parameters can be easily edited in simple HTML markup:
|
1 2 |
<div class="progress-icons" data-font-size="25" data-icon-color="#ffa500" data-active="17" data-total="18" data-icon="fa fa-tint" data-delay="200"></div> |
You can use the following data-attributes to change settings:
- data-font-size=”icon size in pixels”
- data-icon-color=”color of your active icons”
- data-active=”how many icons should be activated?”
- data-total=”number of all displayed icons”
- data-icon=”CSS class of Font Awesome icon, you want to use”
- data-delay=”how fast icon should be activated?”