4

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

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

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

4

2 回答 2

5

干得好。水平和垂直工作。在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);
        }
    }
});
于 2011-02-16T22:40:00.977 回答
0

可以使用jquery draggable自带的drag功能。在拖动功能中,您可以检查内部 div 的边缘是否在容器 div 的边缘之外。

如果是,请增加容器 div 的宽度或高度。

您可以使用 jquery ui 中原生的 position 方法来检查两个 div 标签的顶部、底部、左侧和右侧的位置。

以下是 api 的链接,以获取有关这些方法如何工作的更多详细信息。

  1. 可拖动->事件->拖动
  2. 位置
于 2011-02-16T21:41:02.073 回答