具有“滑动效果”的jquery可排序插件?

jQueryUI有一个很好的插件,可排序: http : //jqueryui.com/demos/sortable/我对这个插件非常满意,但我只缺少一件事。 而不是让改变位置的元素弹出/跳转到新位置,我希望它们“滑动”到新的位置。 换句话说,让它更平滑一点。

我已经在’网上搜索了三天了,并没有找到一个插件(!?!??)。 我的意思是来吧,必须有一个,对吗?

我也尝试过自己修改一下代码,然后让它工作(通过克隆元素,将克隆滑动到新位置,然后删除克隆。同时我隐藏了原始元素删除克隆后取消隐藏)。 但它不能很好地工作,我认为那里肯定有更好的一个!

所以我真的在寻求帮助。 请修改帮助,或者如果您看过这样做的插件,请(:

如果您使用placehoder查看可排序的演示并使用以下代码初始化sortable,您将在占位符中看到滑动操作

$(function() { $("#sortable").sortable({ placeholder: 'ui-state-highlight', start: function (e,ui){ // new lines to $(ui.placeholder).slideUp(); // remove popping }, // effect on start change: function (e,ui){ $(ui.placeholder).hide().slideDown(); } }); $("#sortable").disableSelection(); }); 

您可以将类ui-state-highlight更改为您想要设置样式的任何内容,您可以通过使用css-property visibility将其设置为隐藏并将其设置为隐藏

我在jsbin.com上做了基本的例子,所以你可以看到它的样子

编辑: 开始排序时删除弹出效果的示例

  1. 您可以使用事件选项控制它。 去看一下…
  2. 因为队列是因为如果你拖动一个元素然后拖动另一个元素而没有第一个完成可能看起来很有趣。
  3. 我建议你阅读.stop(),jq队列,可能还有“取消泡泡”

您可以通过以下方式滑动:

 (...).sortable({ revert : 300, ... 

动画的数字以毫秒为单位。 另请参阅类似post: 在JQuery Sortable中,如何在还原动画开始之前运行一个函数?