Question

我正在使用jquery根据绝对定位的手风琴的高度在点击时扩展父div的高度。在这种情况下，它必须绝对定位。

每个手风琴按钮都有自己的功能，父母的高度将是手风琴标题（按钮）+内容，并将根据手风琴的哪个部分打开而改变。

问题是，为了动态获取正确的高度，我需要知道处于打开状态时内容的大小，因为文档加载的默认关闭状态为height:0;

$('.button').click(function(){

var accordionHeight =  $('.accordion-content').height();  //default closed state, height:0;

$('.parent').height(accordionHeight + $('.accordion-title').height());

});

有没有办法确定打开状态下手风琴内容的高度而不将打开状态设置为默认值？

如果您需要更多信息，请告诉我。

编辑：更多信息

想象一下有两个孩子的父母div。手风琴是一个孩子，另一个将与所有州的手风琴div一样高。

Edit2：根据@LouysPatriceBessette解决方案的变化解决。

//expand accordion
    $(".custom-accordion .panel-collapse").addClass("in");
//get height 
    var accordionContent = $('.custom-accordion').height();
//display height 
    console.log(accordionContent);
//collapse accordion   
    $(".custom-accordion .panel-collapse").removeClass("in");
//check we still have the correct height value   
    console.log(accordionContent , "Hello, world!");

    $('.custom-accordion .title').click(function(){  
        $('.sibling').height(accordionContent);
    });

Answer 1

这在这里非常理论......没有整个标记和背景。

但是我很想建议你设置手风琴在负载时打开，只需要在变量中获得所需高度以供以后使用所需的时间。

然后关闭手风琴直到用户点击它打开它。

在那些＆＃34;测量＆＃34;时，您可以将不透明度设置为零...如果打开的手风琴在几毫秒内可见，如果这很难看。

所以一步一步：

在手风琴完全打开的情况下加载页面。 Opacity = 0;
接受所有测量。
关闭手风琴。
将不透明度恢复为1 ...您可以使用fadeIn（）通过＆＃34; desing＆＃34;使其看起来有意。 ;）

Answer 2

尝试我的工作jsFiddle。

这可能是你需要的。 :)希望这会对你有所帮助。

每个内容都会显示按钮是否为clicked。

在关闭时获得Accordions打开状态的高度

2 个答案: