如何增加jquery的對話框高度及與一些效果

Question

動態寬度，當我表示我的對話框然後我的對話框高度爲100和寬度是在背景100等

$("#dialog").dialog({ 
    autoOpen: true, 
    height: 100, 
    width: 100, 
    modal: false, 
    draggable: false, 
    resizable: false, 
}); 

和裝載數據，並且當數據被完全裝載因爲jQuery的ajax有成功的選擇，從那裏我們可以確定數據加載，然後我會顯示這些數據到我的對話框。假設我想顯示到對話框，數據需要更多像高度的空間應爲300和寬度應該是300。因此，當我將自動與否步伐大數據到對話框，然後對話框將被重新大小的數據嗎？

如果不是那我該怎麼編程增加對話框高度和寬度逐漸一樣的高度和寬度將增加，數據將顯示爲對話與淡入效果....如何實現它的一些效果。需要一些代碼的幫助。感謝

Answer 1

首先計算出隱藏對話框元素的高度。之前設置寬度爲300像素，但沒有高度，並添加類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。

=== UPDATE ===

我的更新jsfiddle。

Answer 2

如果你知道的高度/寬度或能以某種方式計算的話，那麼你可以使用

$('#yourDiv').animate({height: '400px', width: '200px'});