There are several options related to the dialog's size, and the minimum and maximum size that it can be resized to. We can add all of these options to the next example as they're all related, to save looking at them individually. Change the configuration object in dialog8.html
to the following:
$("#myDialog").dialog({ width: 500, height: 300, minWidth: 150, minHeight: 150, maxWidth: 600, maxHeight: 450 });
Save this file as dialog9.html
. The effect these options have on the widget is simple; the width
and height
options define how big the dialog is when it is first opened, while the min-
and max-
options define how small or large the dialog can be resized to respectively.