jquery可调整大小:动态minHeight

时间:2013-03-01 23:08:43

标签: jquery html css jquery-ui-resizable

我如何拥有一个基于内部容器的动态minHeight?我有:

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

然后在jQuery上:

$( "#outer-div" ).resizable({
    containment: "#another-outer-div",
    minWidth: 200,
    minHeight: $('#inner-div').height(),
    resize: function(event, ui) {
        ui.size.width += (ui.size.width - ui.originalSize.width);
        $(this).position({
            of: $("#another-outer-div"),
            my: "center center",
            at: "center center"
        })
    }
});

上面的minHeight无效,但希望您了解我想要做的事情;可调整大小的div的高度不应小于具有内容的内部div

3 个答案:

答案 0 :(得分:0)

我从来没有搞过可调整大小的问题但是这里是我如何设置我的最小高度所以内容延伸到底部。

adjustedHeight = (the equation for min-height);
$(".stretchClass").css({'min-height':(adjustedHeight+'px')})

答案 1 :(得分:0)

我认为这是你搜索的内容:

$("#outer-div").resizable({
    containment: "#another-outer-div",
    minWidth: 200,
    start: function(event,ui) {
        $("#outer-div").css({
            minHeight: $('#inner-div').outerHeight()
        });
    }
});

答案 2 :(得分:0)

我意识到这是相当陈旧的,但在初始化期间,您只能为minHeight和minWidth分配一个整数。您无法使用查询。正确的方法是修改&#34; start&#34; -Handler中的minHeight或minWidth选项,如下所示:

Class.cast()