以编程方式设置值时的jQuery ui滑块动画

我正在使用一个按钮和一些按钮来快速选择一组值

当用户单击其中一个按钮时，通过

.slider

方法将滑块设置为相应的值：

$("#mySlider").slider("value", myValue);

这很好，但我想看看滑动动画。我试过了

$("#mySlider").slider({value:myValue, animate:true})

但它并没有像预期的那样工作，因为只有在稍后用户单击滑块时才启用动画

---

我应该使用

setTimeout

编写一个函数来实现我想要的功能，还是使用jQuery有更高级别的方法来实现这一点？

下面是一个JSFIDLE，演示了一个解决方案：

技巧似乎是创建一个滑块，并将其

动画设置为
真
，
慢
，等等。然后您应该通过
$（“#滑块”）。滑块（“值”，150）

注意使用
.slider（'value'，150）
语法（“value”函数）和使用
.slider（{value:myValue，animate:true}）
语法（“option”函数）之间的区别

HTML:

随用随法

像这样的事情应该可以

var slider = $(".slider").slider({
    value: 50,
    animate: true
});

$('#animate').click(function(){
    slider.slider('value', //required value);
});


希望这能有所帮助
请为我们提供一个关于jsfiddle.netThanks的示例，解决方案是将animate设置为True来初始化滑块。
$("#slider").slider(
{
            value:100,
            min: 0,
            max: 500,
            step: 1,
            animate: "slow",
            slide: function( event, ui ) {
                $( "#slider-value" ).html( ui.value );
            }
}
);

$( "#slider-value" ).html(  $('#slider').slider('value') );


$("button").click( function(){
    $("#slider").slider('value', 150);
});

var slider = $(".slider").slider({
    value: 50,
    animate: true
});

$('#animate').click(function(){
    slider.slider('value', //required value);
});