为什么这段代码破坏了jquery UI的拖拽和放大下降(用同位素)

时间:2011-08-09 21:17:11

标签: jquery jquery-ui jquery-ui-droppable jquery-isotope

我有一个带有网格项目的页面。这些项目中的每一项都可以拖到四个div中的一个上,并添加到该div中。这是使用jQuery和JQuery UI draggable / droppable完成的。

第一个同位素项目可以拖到任何一个div上。然而,第二&第3个同位素项目无法识别第一个可放置的div,但是当拖到第2个可放置的div上时,将被添加到第一个可放置的div中。

The 4th&第5个可拖动物品(同位素)无法识别第一个或第二个可放置的div,但是当拖过第3个可放置的物品时,会被添加到第二个可放置的物品中。

所以不知何故,droppable对于丢弃物品的位置感到困惑。

当我注释掉以下代码时,拖放工作正常。关于为什么这段代码会影响可投放区域的任何想法?

jQuery('div.container').isotope({
 itemSelector: 'div.sub-item', 
 resizesContainer : false,
 layoutMode : 'fitColumns',
 getSortData :{ 
   fitOrder : function ($item){
    var order, 
       index = $item.index();
       if($item.hasClass('sub-item-big') && index % 2) {
            order = index +1.5;
            } else {
            order = index;
            }
        return order;
       }
   },
 sortBy : 'fitOrder'
});

---------------更新------------------

经过多次讨论之后,我决定在启动阻力时添加'破坏'同位素。

  jQuery('div.sub-item').draggable({
         helper: function(){
                jQuery('div.container').isotope('destroy');
                return jQuery(this).clone().appendTo('body');
          }
    })

当我以这种方式运行时,项目将被放入正确的容器中。

同位素文件说他们是'移除'功能,有两个问题。

1)文档说它从Isotope小部件和DOM中删除了“指定的项目元素”,但我不想从小部件或dom中删除项目,我只想删除同位素功能< / p>

2)我得到一个错误'在初始化之前不能调用同位素上的方法,试图调用方法删除' - 但是在这种情况下同位素被初始化了,但可能没有被克隆的对象?这超出了我的能力,虽然我希望学习。

现在我找到了一种纠正这种错误的方法,我可以在拖拽时破坏同位素,然后在拖拽完成后重新初始化同位素,或者物品被释放,但这似乎是低效的。

0 个答案:

没有答案