具有恒定宽高比的JQuery Dialog

Question

我需要在可调整大小的对话框中显示图像(到目前为止,我尝试过的所有特定图像弹出库都不符合我的需要).

我想要做的就是在调整大小时保持纵横比.听起来很简单,但事实并非如此.

我认为这样的事情可能有用,但没有骰子:

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

任何指针都非常感谢,tks

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()这里使用是因为你想要包含标题栏和内容的对话框容器. 创建对话框时,它会像这样创建/包装.