Как сделать прогресс бар?

Question

[L1nw0od]

Как сделать полосу загрузки или прогресс бар?
Вот к примеру как на изображении.
Чтобы от 0 до 1000 доходил за 5 секунд, ну и там где цифра 1000 справа считало все это время.
Может есть какие-то готовые решения по этому поводу?

Comments

[Андрей Федоров]

Состояние полосы должно от чего-то зависеть или вам просто анимацию?

Answer 1

[Алексей]

Из готовых решений есть у Bootsrap. Например код:

<div class="progress">
  <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width: 45%">
    <span class="sr-only">45% Complete</span>
  </div>
</div>

Отобразит 45% от 100%
Подробнее тут

Comments

[L1nw0od]

аа Чет я вообще про это забыл(

[Анатолий]

L1nw0od: Если вопрос решен, помечайте, пожалуйста, ответ решением. Это добавит "плюсик" в профиль автору и поможет другим участникам Тостера быстрее найти ответ.

Answer 2

[Stalker_RED]

Самодельный простенький прогрессбар: https://jsfiddle.net/Stalk/9jdueojs/

Скорость настраивается, есть методы stop, start, pause, reset, complete. Можно установить любой процент принудительно (set(50), чтобы выставить 50% например), можно привязать функцию oncomplete.