CODEWITHSUNDEEP
javascriptjqueryjquery-uijquery-mobileslider
Iosif Petre
Iosif Petre

Reputation: 188

How to set the Step of a jquerymobile slider dynamically based on slider value?

I have a jquery mobile slider :

<input type="range" name="slider" data-track-theme="c" 
        data-highlight="true" id="slider-step1" step="10000" 
        value="10000" min="10000" max="9000000" />

and I have to set the step value dynamically like this: Up to 200.000 steps of 10.000, up to 500.000 steps of 25.000, up to 1.000.000 steps of 50.000, up to 2.000.000 steps of 200.000, up to 9.000.000 steps of 500.000.

I tried a lot of things and nothing. Please help!

Upvotes: 1

Views: 3037

Answers (2)

Oibaf it
Oibaf it

Reputation: 1952

It's possible!! Try this solution with your value or variable:

$("#slider-step").attr("min", 4);
$("#slider-step").attr("max", 40);
$("#slider-step").attr("step", 4); 
$("#slider-step").val(4);
$('#slider-step').slider('refresh');

It works for me!!

Upvotes: 2

codaniel
codaniel

Reputation: 5253

Something like this might work.

$('#slider-step1').change(function(){
    currentValue = $(this).val();
    if(currentValue > 200000){
        $(this).attr('step','25000');
    }
    if(currentValue > 500000){
        $(this).attr('step','50000');
    }
    // and on and on 
});

I'm sure you will have to refine this to work as you want it to but this is the basic idea.

Upvotes: 0

Related Questions