Не могу понять как делают такой прогресс бар, как?

Question

[Альберт]

Я только учусь . Стало интересно , как делают такой прогресс бар ( так вроде называется :) ).
Знающие , скажите , на каком языке его пишут ? Javascript ?
Очень интересно стало :)

Answer 1

[Дмитрий Гавриленко]

Странно. Что в данном прогресс баре такого сверхъестественного?

<div style="width: 600px; height: 15px; background: grey;">
<div style="width: 23%; height: 100%; background: lightgreen;"></div>
</div>

Вот в этом прогресс на 23 процента.

Comments

[Дмитрий Гавриленко]

Ну или как Ilya Korablev предложил.

[Альберт]

Я не могу понять , как он работает , как считаются проценты ? Объясните,пожалуйста

[Дмитрий Гавриленко]

Альберт: выполнено / (цель / 100). Вот вся формула. Если вы не об этом, то просто продолжайте учить дальше PHP, HTML, CSS, JS. Через некоторое время, возможно, вы вспомните то, что я вам ответил и поймете почему я ответил именно так.

Answer 2

[Natalia Baženova]

Если всерьез, то читаются данные из backend'a и на основании этого рассчитывается процент.
Например, надо отправить 10 мейлов, после отправки каждого пишется в лог, сколько отправлено, скрипт из аякса читает этот файл - например, там написано в данный момент "4", значит, отображается 40%. Через секунду проверяется еще раз, к этому времени уже, например, 7, значит, отображаем 70%.
А можно не мучаться и сделать фейковый индикатор - сначала что-то как бы грузится, потом доходит до 100% и картинка меняется, например, начинает, что-то крутиться. И пользователь доволен, т.к. у него создается ощущение процесса.

Answer 3

[Ilya Korablev]

Берется input (вроде) и ставится прогрессбар. Ну что сложного?

=====

Исходники курите.

Answer 4

[Тимур]

Честно говря не очень корректный вопрос. Что вас конкретно интересует? Как изменяется шкала с процентами или как сделать просто визуальную часть?

Уточните.
PS: на всякий случай - вот набросал простенький примерчик:
https://jsfiddle.net/timych/ppgbo1o8/3/

Comments

[Тимур]

Ой блин обновил страницу в браузере, а тут уже доходчиво все ответили :)

[Альберт]

Тимур: Я имел ввиду как изменяется сама шкала с процентами ))

Answer 5

[GRuff]

Да, Javascript.