2017-08-23 67 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