user9886249
user9886249

Reputation:

JQuery: a slider with 3 inputs possible?

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

Answers (1)

Muhammad Omer Aslam
Muhammad Omer Aslam

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

Related Questions