Heyecan Bootstrap akordeon tam yükseklik bölmeleri

Question

:

Genellikle akordeon (bot çöküşü eklentisi) kullanarak bir zorunluluk değildir.

/kaydırma o ağırlık tam genişlik/yükseklik içeriğine sahip

sabit üst navbar sahip, temel çerçevesi olarak

• kullanımı bootstrap:

  ne elde etmek istiyorum etmektir

• , 3 ayrı, daraltılabilir içerik panosuna sahip (her zaman yalnızca bir tane genişletilmiştir),
• kafanın üzerine tıklamayı ,
• zaman içerik bölmeleri er kısım içerik bölmesi (| | 2 pic 3 DIV 1) genişletilmiş tek meydana
• kaydırıldığı, içerik bölmesini genişletme (ve daha önce biri genişletilmiş çökme)
bu şekilde cevap düzenleri için çalışma var,
(kendi "başlığının" için) olarak yapılandırılabilir dakika-yüksekliğe sahip her içerik bölmesi vardır, bunların taşma gizli olması, daraltılır.

gerçekten bu (jQuery UI) gibi ek jQuery eklentileri kullanımı "izin" dır

:(üzerinde fikrimi kaybetme düşünüyorum olarak bu konuda biraz yardım almak isterim.

Answer 1

HTML:

<div class="ui-accordion" id="accordion">   
    <h4 class="ui-accordion-header">DIV1</h4> 
    <div class="ui-accordion-content" id="accordion-div1"></div> 
    <h4 class="ui-accordion-header">DIV2</h4> 
    <div class="ui-accordion-content" id="accordion-div2"></div> 
    <h4 class="ui-accordion-header">DIV3</h4> 
    <div class="ui-accordion-content" id="accordion-div3"></div> 
</div> 

CSS: (özel bir şey)

JS:

$("#accordion").accordion({ 
    heightStyle : "fill" 
}); 

Answer 2

bazı JS ile bunu başarmak için başardı. Ben çözemedim

var tabsHeight = $('.accordion-heading').outerHeight() * $('.accordion-heading').length; 
var height = $('#your_accordion_container').innerHeight() - tabsHeight; 

$('.accordion-inner').height(height - 1); 

ben - 1 henüz ne ama .accordion-inner çok büyüktü onsuz gerekir neden

Bunu bir işlevde sardığınızdan ve tarayıcı penceresi yeniden boyutlandırıldığında her zaman çağırdığınızdan emin olun. Ayrıca, .accordion-inner'unuzun dikey bir dolguya sahip olmadığından veya bu dolguyu ayarlanan yükseklikten kaldırdığınızdan emin olun.

Answer 3

Herkes bunun için bir Bootstrap 3 çözüm var mı?

Düzenleme (işe görünmektedir): https://github.com/twbs/bootstrap/issues/2462

$('#accordion').collapse().height('auto');