Как сделать слайдер в виде input: range?

Question

[Даниил Кочкин]

Здравствуйте!

Делаю тренировочный макет, и столкнулся с проблемой, что нет ни малейшего понятия как сделать слайдер в виде range, как это вообще осуществить. Использовать какие-то JQuery библиотеки нет желания, так как все функции писались на чистом JS.

Так выглядит слайдер, который нужно реализовать:

Answer 1

[Сергей delphinpro]

ширина блока с картинками
ширина слайдера
вычисляем смещение ползунка и пропорционально смещаем картинки
детская задачка.

Answer 2

[Шохрух Шаймардонов]

Это не range а просто горизонтальный блок со скроллом. Лучше погуглите как стилизовать скролл, а элементы думаю сами сможете расположить как нужно

Answer 3

[Тарас Шульга]

Если писать с нуля, то Сергей delphinpro дал вам простой самописный вариант. Или можете взять swiper.js он на чистом js и тот функционал там реализовывается в 3 клика.