Как вывести значение range над ползунком?

Здравствуйте. Как над ползунком
<input class="range-style" type="range" min="0" max="100" step="1" value="50">
вывести значение? Как вот здесь:
Плюс сразу зайду вперед, помимо цифр в значении выводится ещё и знак %
К сожалению c JS не очень сильно дружу, на уровне подключения какой-то библиотеки, да и как это верхнее окошко привязать к этой кнопке не понимаю

8dea02f0e1e949779879c2aa334491ad.pngCodepen

Буду благодарен любому ответу
  • Вопрос задан
  • 3900 просмотров
Пригласить эксперта
Ответы на вопрос 3
Не то, что нужно, но промежуточный вариант: https://jsfiddle.net/insp1/1n5am754/.

Если времени нет, то быстрее будет подключить jQuery UI: https://jqueryui.com/slider/#steps
Ответ написан
Комментировать
@ilyapashkov02
Frontend Developer
Если ты плагин используешь, залезь в исходники и там где разметка ползунка, добавь span какой нибудь и в него записывай value, никто за тебя это не сделает, заодно и js повод подтянуть! Потом будешь подобное на раз-два делать, сам такой был
Ответ написан
Ranwise
@Ranwise
поищите на codepen
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы