I would like to use jquery slider to adjust values between 0 and 100, and divide them with percentages
value 1 value 2 and value 3 can be each between 0-90 while the others can't be less than 5, let's thinks about the following values 33,33,34.
the slider should show 3 values and there should be option to move between the values (attached an image) i used jquery slider range, but it is not supporting 33,33 option, i attached the code (i am using angular directive but it's jquery so it looks the same)
if you have any idea how to help me fix this issue
or advice for another component that doing what i need
CODE:
$( "#slider-range" ).slider({
range: true,
min: 0,
max: 100,
values: [ $scope.rangeLeft, $scope.rangeRight ],
slide: function( event, ui ) {
var left = ui.values[0];
var center = ui.values[1];
var right = 100 - Math.abs(Math.round(left + center));
if (left < 5 || left > 95 ||
center < 5 || center > 95 ||
right < 5 || right > 95 ||
left + center > 95 ||
center + right > 95)
{
console.log(left + " " + center + " " + right);
return false;
}
$("#slider-range-left").text(left + '%');
$("#slider-range-center").text(center + '%');
$("#slider-range-right").text(right + '%');
console.log(left + " " + center + " " + right);
}