jquery - jQuery UI 可排序 - 在 X 轴上滑动 div

Question

我一直在寻找解决方案，但没有任何运气。

我有一个容器，里面有一堆 div，并让它们在 X 轴上可排序。我希望找到的是当用户拖动而不是“弹出”它们到位时会“滑动”或“缓解”其他 div 的东西。

任何帮助将不胜感激，干杯！

http://jsfiddle.net/V43Qd/1/

代码

 $( "#dragBubbleContainer" ).sortable({ 
        tolerance: "pointer",
        axis: "x",
        opacity: 0.5,
     });

 $( "#dragBubbleContainer" ).disableSelection();

Answer 1

通过隐藏/显示占位符，我能够将滑动动画添加到可排序列表中。

在这里找到答案：jQuery Sortable with animation

演示 http://jsfiddle.net/V43Qd/3/

    $( "#dragBubbleContainer" ).sortable({ 
        tolerance: "pointer",
        axis: "x",
        opacity: 0.5,
        start: function(e, ui){
            $(ui.placeholder).hide(300);
        },
        change: function (e,ui){
            $(ui.placeholder).hide().show(300);
        }
     });
    $( "#dragBubbleContainer" ).disableSelection();

Answer 2

CSS 过渡和 jQuery 缓动是两种可能的方法。请参阅使用 CSS3 过渡动画 jQueryUI 可排序。