JQuery的滑塊動畫

我想動態顯示滑塊， http://jqueryui.com/demos/slider/#option-animate所以基本上，當它移動到從一個到另一個位置的移動順暢，我實現的代碼，但它不爲我工作：JQuery的滑塊動畫

<script> 
    $(function() { 
     $("#tabs").tabs({ 
      select: function(event, ui) { 
       $("#slider").slider("value", ui.index); 
      } 


     }); 
     $("#slider").slider({ 


      min: 0, 
      max: $("#tabs").tabs("length") - 1, 
      slide: function(event, ui) { 
       $("#tabs").tabs("select", ui.value); 


       }, 


      animate: true 
     }); 
    }); 
    </script>

來源

2011-03-25 jmysona

可以在安裝上jsfiddle.net小提琴？ – JohnP 2011-03-25 12:24:28

這是一個jsFiddle，它應該與他的問題相對應：http://jsfiddle.net/9ycNg/確實，滑塊不會生成動畫，如果刪除了「滑塊{...}」部分，也是如此。 – Sylvain 2011-03-25 13:11:03

在這裏我們去：http://jsfiddle.net/meyson/DryTf/ – jmysona 2011-03-25 13:13:35

當您設置slide: { ... }選項時，您破壞了動畫。添加$(this).slide();修復動畫

$(function() { 
    $("#tabs").tabs({ 
     select: function(event, ui) { 
      $("#slider").slider("value", ui.index); 
     } 
    }); 
    $("#slider").slider({ 
     min: 0, 
     max: $("#tabs").tabs("length") - 1, 
     slide: function(event, ui) { 
      $("#tabs").tabs("select", ui.value); 
      $(this).slide(); // fixes the animation 
     }, 
     animate: true 
    }); 
});

DEMO HERE

來源

2011-03-25 13:14:43 Sylvain

現貨Sylvain !!!!! 感謝您的幫助 – jmysona 2011-03-25 13:20:01

不客氣;） – Sylvain 2011-03-25 13:24:05

@jmysona：如果有幫助，請點擊答案旁的向右箭頭接受答案;） – Sylvain 2011-03-25 14:02:37

JQuery的滑塊動畫

回答

相關問題