Question

我有两个div，我正在使用JQueryUI库将一个div放到另一个div中。

我想将可拖动的div捕捉到drop div中的网格，而不是整个页面中的网格。我发现snap属性要捕捉到drop元素，我还发现了grid属性将它捕捉到网格但是有没有办法将两者合并？

$( "#draggable" ).draggable({ grid: [ 50, 50 ] });

我能想到的唯一其他解决方法是使用许多较小的快照div来填充drop div，这是我不喜欢的方法！

Answer 1

你可以使用droppable的over和out方法来检测draggable何时覆盖它，然后仅在那时实现grid参数。

$("#draggable").draggable();
$("#snaptarget").droppable({
    over: function(event, ui) {
        $("#draggable").draggable({
            grid: [50, 50]
        });
    },
    out: function(event, ui) {
        $("#draggable").draggable("option", "grid", false);
    }
});

<强> jsFiddle example

JQuery UI捕捉到元素中的网格

1 个答案: