子调整大小时自动调整父 div 的大小 - jQuery Resizable答案

【问题标题】：Auto resize parent div when child resize - jQuery Resizable子调整大小时自动调整父 div 的大小 - jQuery Resizable
【发布时间】：2013-05-09 09:19:50
【问题描述】：

我正在使用 jQueryUI Resizable 以及如何在调整子 div 的大小并触摸父 div 的底端时仅调整父 div 的高度。调整大小时，子 div 也不应该外出。

我的代码是这样的：

HTML

<div id="outer">
    <div id="inner"></div>
</div>

CSS

#outer {
 width:500px;
 height:300px;
 border:dashed 1px #000;
}
#inner {
 width:50px;
 height:50px;
 background:#2d2d2d;   
}

$(function(){
    $('#inner').resizable({
        containment: 'parent'       
    })
});

还要检查小提琴； http://jsfiddle.net/hjtBA/122/

【问题讨论】：

标签： jquery html jquery-ui-resizable

【解决方案1】：

您可以将 min-height 和 min-width 应用于父容器，并删除容器。这将使父 div 与子 div 一起扩展。

#outer {
    min-width:500px;
    min-height:300px;
    border:dashed 1px #000;
}

并移除收容限制

$(function(){
    $('#inner').resizable();
});

更新了你的 jsfiddle。 http://jsfiddle.net/hjtBA/126/

【讨论】：