I have a slider with the following properties:
- an horizon开发者_运维百科tal direction
- one handle
- a min of 2
- a max of 65
My goal is to force the user to choose between only 7 points (for example: "2, 3, 4, 26, 39, 52, 65") and nothing more.
How do I create a dynamic step size or how do I allow only those points to be the slider steps?
Why not use a slider with only 7 points, and convert your value with a table:
see my jsfiddle example http://jsfiddle.net/bouillard/Uy5sD/
I suggest that you look at the slide
event. Doc is here.
It says
Return false in order to prevent a slide, based on ui.value.
So you'll just have to return false when the value is not the one you're aiming.
Edit: Damn it, the link just got you to the slider page.
What I'm talking about is in the Events
tab, and it's the one named slide
Edit2: a fiddle using it. The main difference with the other solution is that the sliding won't be uniform in this one.
Edit3: Another fiddle. In this one , if an incorrect value is reached at the end of the slide, it will go back to the previous correct value.
In the following rang price slider step value update dynamically like between 1 to 10000 step will be 100 and between 10000 to 50000 step will be 500 then step will be 1000 Until then 100000 then step will be 1500, 10000, 100000 bases on define value.
This slider will be useful when we went to make steps lower to higher in a big amount of price.
Just we need to define the collection of steps and another one for a given step value on step change, we need to define that value. <> http://jsfiddle.net/Ng_gajera/bt8dusrz/2/
精彩评论