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

Question

[romagresh]

Здравствуйте. Есть ли какие-нибудь плагины, с помощью которых можно такое реализовать? Или если нет то как своими сделать подобное?

То есть нужна полоса, на которой можно расположить такие отметки

Comments

[sudo rm -rf /]

Что это вообще такое?
Описал бы по-нормальному, что ли.

[romagresh]

sudo rm -rf /, диапазон от 0 до 100, представленный в виде серой горизонтальной полосы. Вот нужно каким-то образом располагать в произвольном месте этого диапазона такие метки

Answer 1

[Just A Bit]

Основной контейнер серой полосы делается в relative, внутренние элементы-ползунки через absolute с процентуальным смещением и шириной.

Answer 2

[igumenov]

ionden.com/a/plugins/ion.rangeslider
просто сделать поле активного range прозрачным и по сути то, что и требуется

Comments

[romagresh]

а границы активного range можно сделать различных цветов? то есть начало отрезка одного цвета а конец другого?

[igumenov]

у нас есть начало и конец отрезка - это 2 элемента, их и стилизовать
вот пример

[romagresh]

igumenov, спасибо большое, позже обязательно отмечу как решение! (не сразу отмечаю чтобы посмотреть какие еще решения могут предложить)