$.noUiSlider Reverse Direction of Vertical Slider

4
votes

$.noUiSlider (http://refreshless.com/nouislider/)

Is there a way to reverse the direction of a vertical slider? Meaning, can the min value be at the bottom and max value at the top? I achieved it by setting the range to min: -15, max: 0 but that results in negative values which you then have to convert.

Is there a proper way to do it? There is a way to reverse direction for horizontal sliders but I can't find anything about sliders in the vertical orientation.

Thanks!

1
javascriptjquerynouislider
Have you tried reversing the min and max values? - David Barker
I did. Just seems hacky because I end up with negative values. Just wondering if there was a proper way to do it without having to convert to absolute value after the fact. - Dan H.
What if min was +15 and max was 0? - David Barker
Yeah, I guess that's the way you have to do it. I don't see anything in the docs about reversing it. For horizontal there are "rtl" and "ltr" settings. Thanks! - Dan H.

1 Answers

6
votes

The direction option applies to vertical sliders too. Setting rtl sets bottom-to-top behaviour.

See this example for more information.