jQuery切换显示/隐藏 - div不展开

Question

我是一名有用的助手，可以为您翻译文本。

我有一个小菜单，应该扩展以显示下面的HTML，在目前处于隐藏状态。

按照jQuery：

$('.mobileMenu').click(function(e) {
    $(this).toggleClass('arrowDown').next().slideToggle('slow');
});

这段代码在此页面上运行得很好（点击左侧栏的“隐藏”功能）

然而，我需要在“移动宽度”下使用相同的功能来处理我的菜单。

如果你将浏览器缩小到320或更小，并且进入这里，你会发现菜单只是+菜单（目前有些混乱但可以工作）。点击它，菜单确实展开以显示链接，但它们悬挂在main内容区域上方。 navigation div中的所有div都是display:block，但它们仍然无法推动main div向下。我希望整个绿色navigation div随着其内容扩展。

- Francesca

Answer 1

您的navigation div 的高度为60px，menuWrapper 为30px。您需要将其变为相对大小。

- fredrik

Answer 2

将你的CSS修改为

#rightCol {
width: 72.5%;
float:right;
}

#leftCol
{
width: 25%;
float:left;
}

到

#rightCol {
width: 72.5%;
display:inline-block;
}

#leftCol
{
width: 25%;
display:inline-block;
}

应该可以工作。我已经在Chrome上测试过了。

- ripu1581