JQuery Dialog с постоянным соотношением сторон

Question

Мне нужно отобразить изображение в диалоговом окне с изменяемым размером (на данный момент все определенные библиотеки всплывающих окон с изображениями, которые я пробовал, не соответствуют моим потребностям).

Все, что я хочу сделать, это сохранить соотношение сторон при изменении размера. Звучит просто, но это не так.

Я думал, что-то вроде этого может работать, но без игры в кости:

var d = $("").dialog({title:title, width:400, height:400});
d.resizable( "option", "aspectRatio", true );

Любые указатели очень ценятся, ткс

Answer 1

В связи с тем, как он подключен, я считаю, что проще всего сделать часть с изменяемым размером самостоятельно, например так:

$("div").dialog({
    title:"Title", 
    width:400, 
    height:400, 
    resizable: false
}).parent().resizable({ 
    handles: 'n,e,s,w,se,sw,ne,nw', 
    aspectRatio: true 
});​​​

Вы можете посмотреть демо здесь , вы также можете уничтожить и воссоздать его ... но это немного расточительно, поэтому просто создайте его выше, укажите максимальную / минимальную высоту / ширину изменяемый размер вместо диалога при необходимости. Это должно работать: .parent().resizable("option", "aspectRatio", true), но это не из-за способа подключения виджетов, поэтому самое простое решение - просто создать изменяемый размер самостоятельно с параметрами, которые вы хотите при создании диалога.

Примечание: вы используете .parent() здесь, потому что вам нужен контейнер диалога, который содержит строку заголовка и ваш контент. Он создается / оборачивается так, когда вы создаете диалог .