Question

我目前正在处理发布here的类似内容。但由于某些原因，我在调整视口/浏览器窗口大小时无法使其工作。不太确定我的CSS是否有什么东西或者其他东西是什么。

这是我正在使用的代码：

$(document).ready(function() {

$('.more').hide();

$('.link').click(function() {
    $(this).next('.more').slideToggle();
}).toggle(function() {
    $(this).children("span").text("[-]");
}, function() {
    $(this).children("span").text("[+]");
    return false;
});
var maxHeight = 0;
$('div.simultaneously').each(function(index) {
    if ($(this).height() > maxHeight) {
        maxHeight = $(this).height();
    }
});
$('div.simultaneously').height(maxHeight);
});

当我向下滑动时，我试图让左列（lft-col）与隐藏div的高度相匹配。总的来说，如果调整视口大小，我希望左列div具有浏览器的完整高度。如果隐藏的div滑落，如果有任何滚动，我希望左列div与右列div的高度相匹配。

这是我的小提琴：http://jsfiddle.net/sLVsR/5/

如果有人采用不同的方法来解决这个问题，我也都是这样做的。

Answer 1

重新阅读您的问题后，我对您的代码进行了一些更改

<强>的jQuery

$(document).ready(function() {

    $("div.lft-col").height($(window).height()-20); //I've put in -20 just so you can see the div shadow

    $('.more').hide();

    $('.link')
        .click(function() {
            $more = $(this).next('.more');
            $more.slideToggle('slow', function() {
                if ($more.is(":visible"))
                    $("div.lft-col").height($(document).height()-20);
               else
                    $("div.lft-col").height($(window).height()-20);
            });
        })
        .toggle(function() {
            $(this).children("span").text("[-]");
        }, function() {
            $(this).children("span").text("[+]");
            return false;
        });

    $(window).resize(function(){
       $("div.lft-col").height($(document).height()-20);
    });

});

<强> CSS

#container { 
    /*height: 100%;*/    
}

DEMO

根据另一个div的高度调整div的大小

1 个答案: