CODEWITHSUNDEEP
jquery-uijquery-ui-dialogonresize
user439407
user439407

Reputation: 1756

JQuery UI dialog only resizing horizontally, not vertically

I am trying to create a JQuery dialog that resizes with the window, I can get it to resize horizontally, but the vertical size never seems to change, code is below:

var dlg = $("#dialog"); // Get the dialog container.

dlg.dialog({
    title       : '',
    bgiframe    : true,
    draggable   : false,
    resizable   : true,
    dialogClass : 'dialogRecurso',
    width       : $(window).width(),
    height      : $(window).height(),
    stack       : true,
    zIndex      : 99999,
    autoOpen    : false,
    modal       : true,
    open        : function() {
      $(".ui-dialog-titlebar").hide();
    }
});

$(window).resize(function() {
    $("#dialog").dialog("option","height",$(window).height());
    $("#dialog").dialog("option","width",$(window).width());
});

Any idea why its not growing vertically? I verified that the resize function is getting called and that the dimensions are correct, but after the dialog is created the height of the dialog never seems to change, any ideas on why?

Upvotes: 3

Views: 2653

Answers (1)

Gil Zumbrunnen
Gil Zumbrunnen

Reputation: 1062

Your code seems to be working as intended, the only problem I could see was your added classdialogClass : 'dialogRecurso'.

I tried to operate the other way around, and made a non-resizable dialog while keeping your code alive. I quickly found out that by adding this line in my CSS the window would stop resizing :

.dialogRecurso{max-width:300px; max-height:200px;}

Which makes me think it would be a CSS related issue and has nothing to do with your Javascript.

Upvotes: 2

Related Questions