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

Question

我有一个小菜单，应该会展开以显示下面的HTML，它目前是隐藏的。

下面是jQuery：

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

这段代码在this page上运行得很好(点击左栏的“隐藏”功能)

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

如果你把浏览器调小到320左右，然后转到here，你会看到菜单就是+菜单( mo看起来有点花哨，但还能用)。单击它，菜单确实会展开以显示链接，但它们挂在main内容区域的上方。

navigation div中的所有div都是display:block，但它们仍然不会将main div向下推。我希望整个绿色的navigation div能够扩展它的内容。

Answer 1

您需要将其设置为相对的。

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上测试过了。