Question

I have been working with the slider and am using the following code:

    $(function(){         $('#slider').slider({             animate: true,             step: 1,             min: 0,             max: 10,             orientation: 'vertical',             start: function(event, ui){                 $('#current_value').empty();                 $('#current_value').fadeIn().append('Value is ' + ui.value);             },             change: function(event, ui){                 alert();                 //$('#current_value').empty();             }          });     }); 

I am trying to get it for at the top it is a value of 10 and the bottom is a value of 1 and step 1. Does that look correct?

The other problem I am having is when you move from one position to another, I want it to show the position it stopped on (the current).

So if it is at 4 and you click 7, when you stop append to the DIV I tried changed and stop, but it isnt behaving that way. It is taking the wrong position value.

Link: http://www.ryancoughlin.com/demos/interactive-slider/index.html if you use the keyboard and go to the bottom my goal is to have it step from 1 to 10 in 1 increments

Any thoughts?

Answer 1

replace your CHANGE event with SLIDE … i’ve asked similar question a while ago.

you might want to add STOP event as well … move your logic from START to SLIDE and STOP