Twitter Bootstrap Accordion and button dropdown overflow issue

Question

I\'m using Bootstrap for a section of my website. I mix accordion with a dropdown button. The problem comes when the button is on the bottom, the drop-down is hidden since the .

Answer 1

Set overflow: visible when the menu is open (demo):

$('html').on('click', function() {
    setTimeout(function() {
        $('[data-toggle="dropdown"]').closest('.collapse').css('overflow', '');
    }, 0);
});

$('body').on('click', '[data-toggle="dropdown"]', function() {
    var parent = $(this).parent(), collapse = parent.closest('.collapse');
    setTimeout(function() {
        collapse.css('overflow', parent.hasClass('open') ? 'visible' : '');
    }, 0);
});

There seems to be a redraw issue in Chrome (tested with Chrome 19 on Linux) if we set overflow directly. setTimeout() works around this issue.