change html with jquery select to ui slider slide event

Question

So I've got a select and a function to convert it to a slider using http://filamentgroup.com/lab/update_jquery_ui_slider_from_a_select_element_now_with_aria_support/

<select id="{{ section }}-anonymity-select">
    <option value="anonymous"></option>
    <option value="uw-student"></option>
    <option value="username"></option>
</select>

function setup_form(section){
    $("#"+section+"-anonymity-select").selectToUISlider({tooltip: false, labels: 0, sliderOptions: {
        slide: function(event, ui){
            alert(ui.value);
        }
    }
    }).hide();

What I would like to do is (for now, later I want to change the innerHtml of another element based on the value) alert the current value of the slider as the user is sliding.

The code does almost what I want, except that the slide event "is triggered on every mouse move during slide.", which means about 10 times for one little slide. Very annoying. Not what I want. And it seems to programmatically change the value, too-- my handle keeps jumping all over the place.

I also tried change, but it's only triggered on stop, so if the user is just sliding back and forth but not releasing their mouse button, it won't alert. bad.

How do I handle this? I guess I need something like "on value change" as an event? But how to implement that without constantly checking for it?

Answer 1

of course 2 minutes after I post I realize a solution.

var slidervalue = 0;

function setup_form(section){
    $("#"+section+"-anonymity-select").selectToUISlider({tooltip: false, labels: 0, sliderOptions: {
        slide: function(event, ui){
            if(ui.value!=slidervalue){
                $("#"+section+"-anonymity-header").html("Select anonymity level: "+ui.value);
                slidervalue = ui.value;
            }
        }
    }
    }).hide();