Question

我正在努力解决以下jquery min-height问题。我有四个切换的div和一个页脚都工作正常，但最小高度不在我的控制范围内。这是jquery代码：

$(document).ready(function () {
        $(".btn-toggle").click(function () {
            var bodyHeight = parseInt($(this).parents(".container-wrapper").css('min-height'));
            var linkHeight = $(this).siblings('p.matter').height();
            var addHeight = bodyHeight + linkHeight;
            var subHeight = bodyHeight - linkHeight;
            var isOpen = false;
            if ($(this).siblings("p.matter").css("display") !== "none") {
                isOpen = true;
            }
            $("p.matter").slideUp();
            if (isOpen) {
                $(this).parents(".container-wrapper").css('min-height', subHeight);
                $(this).siblings("p.matter").slideUp();
            } else {
                $(this).parents(".container-wrapper").css('min-height', addHeight);
                $(this).siblings("p.matter").slideDown();
            }

        });//click fn end
    });//document end

为方便起见，我制作了FIDDLE。

感谢任何帮助。

编辑1.当连续点击所有四个切换链接页脚正在向下和向下。（抱歉我的英文）。

Answer 1

将您的脚本更改为下面的脚本（您应该将父div添加到bodyheight而不是添加了）

UPDATED FIDDLE

$(".btn-toggle").click(function () {
    var bodyHeight = parseInt($(this).parents(".container-wrapper").css('min-height'));
    var linkHeight = $(this).siblings('p.matter').height();
    var addHeight = bodyHeight + linkHeight;
    var subHeight = bodyHeight - linkHeight;
    var isOpen = false;
    if ($(this).siblings("p.matter").css("display") !== "none") {
        isOpen = true;
    }
    $("p.matter").slideUp();
    if (isOpen) {
        $(this).parents(".container-wrapper").css('min-height', subHeight);
        $(this).siblings("p.matter").slideUp();
    } else {
        $(this).parents(".container-wrapper").css('min-height', bodyHeight);
        $(this).siblings("p.matter").slideDown();
    }

}); //click fn end

奇怪的最小高度行为

1 个答案: