jquery滑块设置滑动后的值

Question

我试图设置滑块在滑动事件中的值。这里是我的代码：

$(document).ready(function() { 
      $("#slider").slider({ 

       min: 0, 
       max: 10000, 
       step: 1, // Use this determine the amount of each interval 
       values: [0], // The default range 
       slide: function (event, ui) { 
        var slider = $("#slider").slider({ 
         animate: true 
        }); 
        slider.slider('value', 500); 
       } 
      }); 
     }); 

我在想什么？我似乎无法设置动画并设置滑块的值。

编辑：好吧，现在我可以设置滑块的值，但它发生得太快。我希望它慢慢达到我设定的价值。这里是我的编辑代码：

$(document).ready(function() { 
      $("#slider").slider({ 

       min: 0, 
       max: 10000, 
       animate: "slow", 
       step: 1,// Use this determine the amount of each interval 
       // values: [0] // The default range 
       change: function (event, ui) { 
        $("#slider").slider('value', 500); 
       } 
      }); 
     }); 

我怎样才能使它慢慢移动到500，而不是设置它的时候了吗？

谢谢

Answer 1

参考：

jsFiddle

移动滑块按钮并将其释放后，滑块按钮将动画回到锁定值。

代码：

$(document).ready(function() { 

    $('#slider').slider({ 
     min: 0, 
     max: 10000, 
     // Values "fast", "normal", "slow", or duration can be used. 
     animate: 1500, 
     step: 1, 
     // Starting value is 500 
     value: 500, 
     animate: true, 
     change: function(){ 
      // This setTimeout will allow the slider to animated correctly. 
      setTimeout("$('#slider').slider('value', 500);", 350); 
     } 
    }); 

    // On page load, animate the slider to this value of 500. 
    $('#slider').slider('value', 500); 

}); 

---

状态更新：所谓海报所需的stop:事件，而不是在UI滑块的change:事件等具体要求，但没有视觉差看到什么时候使用。