initially i am showing jquery dialog with fixed height and width at center of page. now i want to put a div with lots of html content inside the dialog. now i want to dynamically increase dialog height & width according to the div height & width with animate function but i want that dialog should stick at the center of page.
when dialog open first time at center of page and later if i change the height & width then dialog is not position at the center of page. so help me with concept that how to force dialog stick at center of page when height & width will be increasing with animate function.
this way i am working with dialog….here is my small code
$(document).ready(function () {
$("#dialog").dialog({
autoOpen: false,
bgiframe: true,
height: 85,
width: 330,
modal: false,
draggable: true,
resizable: false,
position: 'center',
show: {
effect: "fade",
duration: 1000
},
hide: {
effect: "fade",
duration: 500
},
open: function (type, data) {
$(this).parent().appendTo("form");
}
});
});
if possible then please show me the trick with sample code. thanks
Best Answer
OK, would this work, assuming nothing about how the element is resized?
http://api.jquery.com/resize/