javascript - JqueryUI Draggable - 自动调整父容器的大小

Question

我有两个 div，一个在另一个里面。外部 div(容器)具有任意尺寸。内部 div 被设置为小于其容器的指定尺寸。

我已经将 jquery draggable 应用于内部 div，并且我希望在将内部 div 拖过容器的外边缘时自动调整其父容器的大小。我该怎么做呢？

当我问一个新问题时，我在 StackOverflow 上看到了类似的功能。用于输入问题的文本区域有一个名为“grippie”的 div，它可以调整文本区域的大小。这正是我正在寻找的功能，但使用的是 div 而不是文本区域。

Answer 1

给你。水平和垂直工作。看到它在行动 http://jsfiddle.net/evunh/1/

var i = $('#inner');
var o = $('#outer');
i.draggable({
    drag: function(event, ui) {
        if (i.position().top > o.height() - i.height()) {
            o.height(o.height() + 10);
        }
        if (i.position().left > o.width() - i.width()) {
            o.width(o.width() + 10);
        }
    }
});