0

我目前正在处理此处发布的类似内容。但是由于某种原因，当调整视口/浏览器窗口的大小时，我无法让它工作。不太确定我的 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/

如果有人有不同的方法来解决这个问题，我也完全赞成。

4

1 回答 1

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%;*/    
}

演示

于 2013-01-02T18:12:26.127 回答