如何使用瀏覽器調整jQuery UI對話框的大小

我打開jQuery UI對話框並在其中加載一些內容。但是，當我調整瀏覽器jq對話框不改變它的寬度/高度。我嘗試了一些東西，但沒有運氣。在這裏我怎麼打開它：在對話框已經打開如何使用瀏覽器調整jQuery UI對話框的大小

$(document).ready(function() { 
    var wWidth = $(window).width(); 
      var dWidth = wWidth * 0.9; 
      var wHeight = $(window).height(); 
      var dHeight = wHeight * 0.9; 

      $(".openDialog").live("click", function (e) { 
       e.preventDefault(); 
       $("<div></div>") 
        .addClass("dialog") 
        .attr("id", $(this).attr("data-dialog-id")) 
        .appendTo("body") 
        .dialog({ 
         title: $(this).attr("data-dialog-title"), 
         close: function() { $(this).remove() }, 
         modal: true, 
         resizable: false, 
         show: 'fade', 
         width: dWidth, 
         height: dHeight,      
         create: function (event, ui) { 
          $(this).parents(".ui-dialog:first").find(".ui-dialog-titlebar").css("display", "none"); 

          $(this).parents(".ui-dialog").css("padding", 0); 
          $(this).parents(".ui-dialog").css("border", 0); 
          $(this).parents(".ui-dialog:first").find(".ui-dialog-content").css("padding", 0); 

          $(this).parents(".ui-dialog:first").find(".ui-dialog-content").css("background", "#000000"); 
          $(this).parents(".ui-dialog:first").find(".ui-dialog-content").css("overflow", "hidden"); 

         } 

        }) 
        .load(this.href); 
      }); 
$(window).resize(function() { 
      var wWidth = $(window).width(); 
      var dWidth = wWidth * 0.9; 
      var wHeight = $(window).height(); 
      var dHeight = wHeight * 0.9; 
      $(".openDialog").dialog("option", "width", dWidth); 
      $(".openDialog").dialog("option", "height", dHeight); 
     }); 
});

來源

2012-03-26 1110

後的寬度和高度都是靜態的，除非調整。將事件綁定到窗口大小調整將改變它。

$(window).resize(function() { 
    var wWidth = $(window).width(); 
    var dWidth = wWidth * 0.9; 
    var wHeight = $(window).height(); 
    var dHeight = wHeight * 0.9; 
    $("#data-dialog-id").dialog("option", "width", dWidth); 
    $("#data-dialog-id").dialog("option", "height", dHeight); 
});

來源

2012-03-26 21:08:48

我把我的整個功能爲您提供了調整大小功能加載UI對話框。我得到對話框調整大小的瀏覽器調整大小，但然後我ui對話框不是模態它顯示爲一個頁面，我得到錯誤：未捕獲ReferenceError：$未定義（匿名函數） – 1110 2012-03-26 21:34:14

我會離開它們作爲兩個單獨的功能。這樣調整大小不會影響對話框的init。只需將文件就緒功能中的代碼放在窗口大小調整功能後面即可。 – 2012-03-27 15:00:57

我已更新問題。我必須做一些錯誤的事情，因爲它沒有調整大小:( – 1110 2012-03-27 16:00:15