daisyui / react-daisyui

daisyUI components built with React 🌼
http://react.daisyui.com/
MIT License
886 stars 98 forks source link

How do I get a multi range slider? #445

Closed brandonfake69 closed 2 months ago

brandonfake69 commented 2 months ago

I would like to modify the range slider to be able to be a multi range slider. How do I do that? https://daisyui.com/components/range/

e.g. something like this: https://tailwindcomponents.com/component/multi-range-slider

benjitrosch commented 2 months ago

That's something you'll have to build yourself involving a bit of Javascript and magic to support multiple sliders on the same track for a range type Input. At the moment the daisyui does not support this and I can't imagine it's on the roadmap.

You can accomplish this by overlaying two range input's over one another, and making sure the max cannot be lower than the min, and vice versa.