Change slider pagination?

Question

css

the essence is as follows, there is such a standard slider from bootstrap

at the bottom there are three dashes for switching slides

I need to make this slider

with such a peculiar input type range
even I don’t understand how to do it at all) tell me)

Answer 1

Track through js the event of changing the value of rage and scroll to the corresponding slide.
The bootstrap slider has methods for this, see here: https://getbootstrap.com/docs/4.0/components/carousel/
And also, if it is supposed to be a decorative element and it just needs to look like this, then you can use these initial strips via css through css, lower it below and correct it so that they fit into a tight one. And select active. Then visually it will be exactly the same and will even work. Only not by dragging, but by clicking.