具有恒定宽高比的JQuery Dialog

时间:2010-06-16 21:18:26

标签: javascript jquery dialog

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

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

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

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

任何指针都非常感谢,tks

1 个答案:

答案 0 :(得分:6)

由于它被吸引的方式,我发现自己最简单地做可调整大小的部分,就像这样:

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

You can view a demo here,你也可以销毁并重新创建它...但这有点浪费,所以只需在上面创建它,如果需要,在可调整大小而不是对话框中指定最大/最小高度/宽度。这个应该工作:.parent().resizable("option", "aspectRatio", true),但它不是由于小部件的连接方式,所以最简单的解决方案是在创建时使用您想要的选项自己创建可调整大小对话框。

附注:你在这里使用.parent()是因为你想要包含标题栏和内容的对话框容器。 It's created/wrapped like this when you create the dialog