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

Question

我正在使用 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;   
}

JS

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

score 3 · Accepted Answer

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

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

并解除收容限制

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

1 回答 1