动画 jQuery UI 对话框自动调整大小答案

【问题标题】：Animate jQuery UI dialog auto resize动画 jQuery UI 对话框自动调整大小
【发布时间】：2011-10-16 01:24:45
【问题描述】：

我有一个对话框，里面有一个动态表单，可以增加对话框的高度。 autoResize 设置为 true，width 设置为 500。添加更多内容时，有什么方法可以让对话框调整大小？

【问题讨论】：

【解决方案1】：

当我使用@Steven 的答案时，我遇到了内容大小的问题，就像@jedierikb 在评论中所说的那样。所以我创建了这段代码，它可以工作。

$(dialogSel).dialog("widget").animate({
    width: 100,
    height: 200
}, {
    duration: 200,
    step: function (now, tween) {
        if (tween.prop == "width") {
            $(dialogSel).dialog("option", "width", now);
        } else {
            $(dialogSel).dialog("option", "height", now);
        }
    }
});

【讨论】：

【解决方案2】：

动画对话框大小，同时保持在屏幕的中心

jQuery("#dialog").dialog("widget").animate({
    width: '400px', 
    height: '110px'
  }, {
  duration: 500,
  step: function() {
    jQuery("#dialog").dialog('option', 'position', 'center');
  }
});

【讨论】：

完成大小调整/放大后，当我通过 html( ) 添加新内容时，我的内容将被裁剪到之前大小的高度...

【解决方案3】：

最初我使用的是.show('fade')，每当调用.show 时，对话框的大小就会跳跃。当使用.show('fast') 或.show('slow') 效果时，对话框会以适合我的滑动方式调整大小。

【讨论】：