OK, I have tried this answer:
JQuery Slider, how to make "step" size change
But it’s for dual sliders, and doesn’t meet my needs.
I have a ranged (fixed minimum) slider, where I have the following steps:
5, 10, 20, 50, 100, 150
I’m ignoring the min range, and just needing the values from the steps.
Additionally, creative wants the steps to be non-linear:
So I have to create steps at the ticks in the image.
I’ve tried various ways shown in stackoverflow, but unable to come up with a feasible answer.
Any help would be appreciate. Thanks.
$ (function() {
$ ( "#parkSlider" ).slider({
range: "min",
value: 50,
min: 0,
max: 150,
step: 10,
slide: function( event, ui ) {
$ ( "#amount" ).val( "$ " + ui.value );
}
});
$ ( "#amount" ).val( "$ " + $ ( "#slider-range-min" ).slider( "value" ) );
});