jquery - 当 slideDown()/slideUp() 发生时，你能拉伸(stretch)背景高度吗

Question

所以我做了一个像隐藏菜单一样的隐藏 Accordion ，当使用 .slideUp() 和 .slideDown( )。但是当子菜单向下滑动时，整个菜单移动超过包含 div 背景的设置高度。但是我不能将 .animate() 放在我的 JQuery 代码中用于 .slideDown()/.slideUp() 部分，因为不是所有的子菜单的组合高度相同。

演示:http://codepen.io/PorototypeX/pen/Dvjwx

想我也把 JQuery 放在这里(如果你想在这里也看到其他代码，请问我会编辑它):

    $(document).ready(function () {
        $("#topnav a").click(function () {
            var el = $(this).parent();
            if (el.hasClass('active') && $(this).next().is(':visible')) {
                var active = el.siblings('.active');
                $(this).next().slideUp();
            }
            else if (el.hasClass('active') && !$(this).next().is(':visible')) {
                var active = el.siblings('.active');
                $(this).next().slideDown();
            }
            else if (!el.hasClass('active')) {
                $(this).next().slideDown();
                var active = el.siblings('.active');
                active.children('ul:first').slideUp();
                active.removeClass('active');
                el.addClass('active');
            }
        });
    });

Answer 1

您可以使用一些 CSS 轻松解决这个问题。 Forked Pen

说明:从div.backing和.navbar的top中删除了硬编码的高度，添加了一些padding 到 .backing 以便在 .navbar 上方和下方显示一些背景。现在元素的背景会随着它的内容变大/变小。根据您的喜好设置填充值。