How to create this range slider filter

Hi, is there a way of creating a range slider like this one for filtering numbers?

Screenshot 2023-08-24 155613

I don’t think you can do that yet in Bubble as there are no native controls or actions for dragging an element along another’s axis.
But there are paid plugins that allow you to add customizable slider inputs to your app. A good example is Advanced Range Slider. Though I cannot comment on how good they are or if they work at all, as I have never used one.

You could use bubble’s slider input and set the slider type to range. This will give you 2 handles on the slider for a min / max position

You could use a htmlelement to customise the slider’s attributes so that you replace the bar with a circle (if needed) however, I suspect the default bar handles will suffice for your use case.

You could then use text elements to display the slider.value:min and slider.value:max

This topic was automatically closed after 70 days. New replies are no longer allowed.