jquery-ui slider: passing current value to a function

Question

I'm using the jquery-ui slider. I would like to pass the current value of the slider to a function every time there is a change, but I'm not sure how to?

// jquery ui slider
$(function() {
$( "#slider-range-max" ).slider({
  range: "max",
  min: 1,
  max: 100,
  value: 2,
  slide: function( event, ui ) {
  $("#amount").val( ui.value );
  }
});
$("#amount").val($("#slider-range-max").slider( "value" ) );

});

function skillLevel(){
// do something based upon slider value
};

Answer 1

I'm not aware of the library, but it seems, that slide is called each time the slider changes it's value. Within slide you are able to access value and call your own function like this:

slide : function(event, ui) {
  skillLevel(ui.value);
}

or alternatively:

slide : function(event, ui) {
    skillLevel(value);
}

Answer 2

http://api.jqueryui.com/slider/#event-change

$( "#slider-range-max" ).slider({
  range: "max",
  min: 1,
  max: 100,
  value: 2,
  slide: function( event, ui ) {
  $("#amount").val( ui.value );
  },
    change: skillLevel
});
$("#amount").val($("#slider-range-max").slider( "value" ) );

function skillLevel(){
// do something based upon slider value

};

TEST