jQuery的加入可排序/可拖动到同位素砖石

我有关于jQuery插件isotope问题。

enter image description here

正如你可以看到here on jsfiddle我有一个动态布局的网格（您可以点击一个div和大小和布局的变化）。现在我想通过使用jQuerys sortable以其他顺序对items进行排序。添加此的代码：

$container.sortable({ 
    items: '.item' 
});

将它拖动，但没有任何排序功能。

我在做什么错？

TIA - 与问候， frgtv10

来源

2012-07-24 frgtv10

jQuery的同位素不支持拖动的元素，见http://metafizzy.co/blog/mythical-drag-drop-multi-column-grid-plugin/ – Systembolaget 2012-07-24 12:16:06

这是我想要的东西非常糟糕！我正在考虑打击作者，试图合作并实现这一目标！这将是自切片面包以来最好的事情！ – Chev 2012-08-10 21:19:33

这是可能的，但有限制。看看 http://tyler-designs.com/masonry-ui/

来源

2012-11-01 11:41:54 Entea

和同位素/石工作者的相关博客文章：http://metafizzy.co/blog/mythical-drag-drop-multi-column-grid-plugin/ – ptim 2013-04-08 06:03:24

MetaFizzy有一个名为Packery的新插件，它可以做你想做的。

在这里看到更多：http://packery.metafizzy.co/draggable.html

来源

2013-04-24 13:34:29

你可以用我gridster.js的修改与调整大小添加的。（也砖石&拖动含税）

https://github.com/evaldsurtans/gridster.js

例子： http://evalds.lv/gridster

来源

2013-04-24 15:21:47

这个例子的URL现在是404。 – 2013-07-10 20:32:59

谢谢，我将恢复在线 – 2013-07-22 08:24:37

示例没有在Chrome中工作:( – Maxx 2013-10-11 18:32:02

我给你一个链接的jsfiddle ...退房，他们都使用jQuery的可拖动和同位素。

http://jsfiddle.net/ganeshgaxy/yL3Lu/

$(document).ready(function() { 
    $('#inner').isotope({ 
     itemSelector: '.gravity' 
    }); 
    var list = $('#inner'); 
    list.sortable({ 
     cursor: 'move', 
     start: function (event, ui) { 
      ui.item ...

来源

2014-08-12 09:45:21

不是真正的砌体因为所有的元素都有相同的尺寸 – Ben 2014-10-29 00:01:20

LGTM！它工作的很好！@Ben：它也可以使用可变的高度。 – xxxbence 2016-09-21 11:20:07

jQuery的加入可排序/可拖动到同位素砖石

回答

相关问题