I have this horizontal range slider widget and I want vertical option as well. Although I am able to change the orientation of the slide bars, I just can't seem to make the handles do the same. Any ideas on what I missed?
It would be better if you could recreate this on codepen or fiddle so we have something to work with but from the looks of it all you would need to do is change your slider class height + width values to whatever you need.
Then on your javascript
$("#slider-heatresist").slider({
orientation: "vertical", //Add this
slide: function (event, ui) {
var value1 = (ui.value * 225 / 100).toFixed();
var value2 = (ui.value * 225 / 100).toFixed();
filter.sl7_min = value1;
filter.sl7_max = value2;
filterItems();
if (ui.value == 0)
value1 = "Keine Auswahl";
$("#heat_resistance").val(value1);
},
create: function (event, ui) {
$("#heat_resistance").val("Keine Auswahl");
}
});//7
For more information on this you can refer to https://jqueryui.com/slider/#range-vertical