让JQuery用户界面对话框会自动扩大或缩小以适合其内容

StackOverflow https://stackoverflow.com/questions/756325

题

我有一个显示的形式的JQuery用户界面对话框弹出。通过表格上选择某些选项的新选项就会出现在形式使其长得更高。这会导致一种情况，主要页面有一个滚动条和JQuery用户界面对话框中有一个滚动条。此两滚动条的情况是难看的和混乱的用户。

我怎样才能让JQuery用户界面对话框增长（以及可能的收缩）总是适合其内容，而不显示滚动条？我宁愿只有主网页上的滚动条是可见的。

有帮助吗？

解决方案

<强>更新在jQuery UI 1.8，工作溶液（如在第二条评论中提及）的是使用：

width: 'auto'

使用自动调整：真正的选项。我将说明：

  <div id="whatup">
    <div id="inside">Hi there.</div>
  </div>
   <script>
     $('#whatup').dialog(
      "resize", "auto"
     );
     $('#whatup').dialog();
     setTimeout(function() {
        $('#inside').append("Hello!<br>");
        setTimeout(arguments.callee, 1000);
      }, 1000);
   </script>

这里的一个工作示例： http://jsbin.com/ubowa

其他提示

答案是设置

autoResize:true

创建对话时属性。为了使这个工作，你不能设置任何高度的对话框。所以，如果你在像素的对话框中它的创始人方法或通过任何样式设置一个固定高度的自动调整属性将无法工作。

此工作与jQuery UI v1.10.3 

$("selector").dialog({height:'auto', width:'auto'});

我用下面的属性这对于我正常工作：

$('#selector').dialog({
     minHeight: 'auto'
});

高度被支撑为自动。

宽度不！

要做一些自动的得到你所显示div的大小，然后设置窗口。

在C＃代码.. 

TheDiv.Style["width"] = "200px";

    private void setWindowSize(int width, int height)
    {
        string widthScript =    "$('.dialogDiv').dialog('option', 'width', "    +   width   +");";
        string heightScript =   "$('.dialogDiv').dialog('option', 'height', "   +   height  + ");";

        ScriptManager.RegisterStartupScript(this.Page, this.GetType(),
            "scriptDOWINDOWSIZE",
            "<script type='text/javascript'>"
            + widthScript
            + heightScript +
            "</script>", false);
    }

var w = $('#dialogText').text().length;

$("#dialog").dialog('option', 'width', (w * 10));

做了什么我需要它调整大小的对话框的宽度做的。

如果你需要它在IE7中工作，你不能使用无证，车和不受支持 {'width':'auto'}选项。相反，下面添加到您的.dialog()：

'open': function(){ $(this).dialog('option', 'width', this.scrollWidth) }

无论.scrollWidth包括右侧填充依赖于浏览器（Firefox从铬的不同），所以你可以添加一个主观“足够好”的像素的数目到.scrollWidth，或与自己的宽度计算函数替换它。

您可能要包括你的width: 0选项中.dialog()，因为这种方法会不会减少宽度，只会增加它。

测试在IE7，IE8，IE9，IE10，IE11，火狐30，铬35，和Opera 22。工作

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top