2017-08-23 69 views
0

我正在使用jquery扩展父点击高度,基于绝对定位手风琴的高度。在这种情况下,它必须是绝对的定位。获取高度的手风琴打开状态,同时关闭

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

的问题是,以动态地得到正确的高度,我需要知道的内容的大小时处于打开状态作为默认的文档加载关闭状态height:0;

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

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

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

}); 

有什么办法确定手风琴内容在开启状态下的高度,而不将默认状态设为开启状态?

如果您需要更多信息,请让我知道。

编辑:一些更多的信息

想象有两个孩子的父母DIV。手风琴是一个孩子,而另一个手风琴的高度始终与所有州的手风琴师相同。

编辑2:根据@ 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); 
    }); 
+1

你好,你只需要在.accordion-content处于打开状态时添加高度对吗?当我点击每个按钮? – bellabelle

+0

@bellabelle是的,这是正确的。 – JPB

回答

1

这在这里很有理论性......没有整个标记和上下文。

但我很想建议您设置手动打开负载,只需要将需要的高度(s)用于变量以备后用。

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

虽然这些“测量”,你可以设置不透明度为零...如果打开的手风琴可见几毫秒,如果这是丑陋的。

所以步骤一步:

  1. 负载与手风琴的页面完全打开。不透明度= 0;
  2. 采取所有措施。
  3. 关闭手风琴。
  4. 恢复的不透明度为1 ...你可以使用淡入(),使它看起来是“德兴”故意;)
+0

这绝对是我可以使用的解决方案。如果您设置了不透明度,您将无法看到任何内容:1您是否处于关闭状态? – JPB

+0

我没有得到最后一个问题......但我会玩弄手风琴容器的不透明性,只是为了让它在测量时不可见所以,当它不应该打开时。这是几毫秒。 –

+1

基于这个想法解决,而不需要不透明。在原始问题中添加了代码,感谢您的帮助。 – JPB

1

试试我的工作jsFiddle

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

每个内容将显示按钮是否为clicked

+0

谢谢,但这不是很对。设想一个有孩子的父母,手风琴是一个孩子,另一个孩子的内容将永远与所有州的手风琴一样高。 – JPB