Как реализовать progress bar?

Question

[by_ultra]

Дайте пожалуйста совет, как реализовать progress bar:



При внесении информации в input данный progress bar должен динамически передвигать .

Answer 1

[Ankhena]

Один спанчик поверх другого.
Переключайте значение ширины в зависимости от условия.
Удобно через кастомные свойства.

В теории даже на чистом CSS можно сотворить на основании :valid и/или :placeholder-showen

Answer 2

[Alex]

https://developer.mozilla.org/ru/docs/Web/HTML/Ele...

И в JS следите за изменениями в input и меняете значение в progress