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

Question

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

在 jQuery 之后：

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

这段代码在此页面上效果很好（单击左侧的“隐藏”功能）

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

如果您将浏览器的大小调整到 320 左右并转到此处，您会看到菜单只是 +menu（在 mo 中有点糟糕但可以工作）。单击它，菜单会展开以显示链接，但它们挂在main内容区域上。

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

score 3 · Accepted Answer

navigation你在div60px和menuWrapperat的 div上有一个固定的高度30px。你需要使这个相对。

score 0 · Accepted Answer

改变你的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 上测试过了

2 回答 2