Reputation:
I wanna create a slider with 3 inputs. I have made a lot of research but can't find more than a slider with 2 inputs :/
Here is the code: http://jqueryui.com/slider/#range
How can I create a 3 input slider ? I want to have a slider that move with the 3 inputs. For example, if the input1 is at 0, input2 at 50 and input3 at 100 and the max value is 100. If i put the input2 at 25, the input2-input1 is going to get low and input3-input2 is going to get high.
Upvotes: 2
Views: 343
Reputation: 23738
What i understand you are looking for 3 drag handles on a slider if i am not wrong you can do that like below
$("#slider").slider({
min: 0,
max: 100000,
values: [0, 50000, 100000],
});
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div id="slider"></div>
Upvotes: 1