当我显示对话框时,我的对话框高度为 100,宽度为 100,如
$("#dialog").dialog({
autoOpen: true,
height: 100,
width: 100,
modal: false,
draggable: false,
resizable: false,
});
并在后台加载数据,当数据完全加载时,因为 jquery ajax 有成功选项,从那里我们可以确定数据已加载,然后我会将这些数据显示到我的对话框中。假设我想在对话框中显示的数据需要更多空间,例如高度应该是 300,宽度应该是 300。那么当我将大数据放入对话框中时,对话框是否会自动调整大小?
如果没有,那么我如何以编程方式增加对话框的高度和宽度,一些效果,例如逐渐增加高度和宽度,并且数据将出现在带有淡入效果的对话框中......如何实现它。需要一些代码的帮助。谢谢
最佳答案
首先计算隐藏对话框元素的高度。在将宽度设置为 300px,但没有高度并添加类 ui-widget
之前。
HTML:
<div id="dialog" class="ui-widget">...
CSS:
#dialog {
display: none;
width: 300px;
}
JS(16px 是对话框填充):
var iHeight = $('#dialog').height() + 16;
创建对话框后,设置对话框包装的新宽度,如果当前高度低于计算值,则启动动画。
JS:
if ($("#dialog").height() < iHeight) {
$("#dialog").parent().width(300 + 50);
$("#dialog").animate({ height: iHeight, width: '300px'}, 500);
}
另请参阅我的jsfiddle .
===更新===
我更新了jsfiddle .
关于jquery - 如何动态增加jquery对话框的高度和宽度并产生一定的效果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7906857/