jquery - jQuery UI 可拖放、可拖动、可调整大小和对齐网格

Question

我有以下结构：

<div id="grid">
    <div class="columns"></div>
    <div class="columns"></div>
    <div class="columns"></div>
    ...
</div>
<div id="assets">
    <div class="assets" id="asset1"></div>
    <div class="assets" id="asset2"></div>
    ...
</div>

我想让每个资产可放置、可拖动、可调整大小并捕捉到将位于资产下方的每一列。可拖动的 jQuery UI 没有开箱即用的网格对齐功能，因此我正在尝试对其进行调整以满足我的需要，但是即使是可调整大小的对齐方式也只能对齐像素值的网格（据我所知）。有没有办法我可以使用

$(".assets").resizeable({ grid: $(".columns") }); ?

我已经尝试过了，但它不起作用。我还发现了这个：https ://github.com/polomoshnov/jQuery-UI-Resizable-Snap-extension

但它似乎不适用于两种不同的元素（一个用于网格，另一个用于可拖动）。

关于如何使这项工作的任何想法？

谢谢