jQuery-UI可调整大小,调整子元素的大小

时间:2011-02-28 14:47:59

标签: jquery-ui jquery-ui-resizable

我有div元素,包含图像。我想使用jQuery-UI使div可调整大小,调整div和子图像元素的大小。

我尝试过使用alsoResize,如下所示,但它似乎调整了第一个div图像而不是相应的子图像。

$('div').resizable({
    alsoResize: $(this).find('img'),
    aspectRatio: true,
    maxHeight: 140
});

我创造了一个小提琴来演示这个http://jsfiddle.net/letsgojuno/EhyGy/

看起来这个上下文总是第一个div,而不是当前正在调整大小的div。

1 个答案:

答案 0 :(得分:5)

由于$(this)中的alsoResize将获得第一个div,因此每次进行调整大小事件时,它都会仅调整第一个图像的大小。您必须为每个元素创建可调整大小,如下所示:

$('div').each(function () {
    $(this).resizable({
        alsoResize: $(this).find('img'),
        aspectRatio: true,
        maxHeight: 140
    });

});