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

Question

我有一个内部带有动态表单的对话框，可以增加对话框的高度。 autoResize设置为true，width为500.添加更多内容时，有没有办法动画对话框调整大小？

Answer 1

制作动画对话框大小，同时停留在屏幕的中心

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

Answer 2

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

Answer 3

当我使用@ 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);
        }
    }
});