Изменение размера jQuery-UI, изменение размеров дочерних элементов

Question

У меня есть элементы div, содержащие изображения.Я хочу, чтобы размер div можно было изменять с помощью jQuery-UI, изменяя размеры элементов div и дочерних изображений.

Я попытался использовать также Resize, как показано ниже, но, похоже, он изменяет размер первого изображения div вместо соответствующего дочернего изображения.

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

Я создал скрипку, чтобы продемонстрировать это http://jsfiddle.net/letsgojuno/EhyGy/

Кажется, этот контекст всегда является первым div, а не текущим изменяемым div.

Answer 1

Поскольку $(this) in alsoResize получит первый div, каждый раз, когда вы делаете событие изменения размера, оно будет изменять размер только первого изображения. Вы должны будете создать изменяемый размер для каждого элемента, как это:

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

});