CODYSHOP
темы и плагины для WordpressОдин из самых сложных html элементов для оформления – это input с типом range, или проще говоря ползунок выбора. Обычно выбора диапазона чисел. Хотя в Сети можно найти немало хороших вариантов, я хотел бы поделиться своим, как красиво оформить данный элемент. Вначале определимся с задачами:
- Элемент будет состоять из 4 частей: собственно сам двойной ползунок, линейка с отметками со значениями, поля для ручного ввода значений, и кликабельная гистограмма (как на Алиэкспресс).
- Ползунок должен быть адаптивным.
- Минимум javascript.
- Отказываемся от использования картинок (не очень удобно редактировать внешний вид). Кому интересно, вот еще один качественный слайдер для диапазона цен с использованием изображений.
Чтобы не описывать каждый элемент по отдельности, сразу дам ссылку демку:
Спасибо, добрый человек! 🙂