jquery - 在隐藏/显示另一个 div 后调整主 div 的宽度

Question

我有一个包含两个 div 的主 div。一个用于主要内容，一个用于侧边栏内容。单击一个链接会隐藏/显示边栏内容。所以当侧边栏隐藏时，我希望内容div像容器div一样占据整个空间。但是当显示侧边栏内容时，它应该给左侧的侧边栏一些空间并自行调整。这是 code .现在我正在使用 jquery 实现。但不确定是否有更好的方法来做到这一点。谢谢

Answer 1

你快到了。我已经更新了你的代码。基本上，您只想将侧边栏放在第一位，将它们都向左浮动，并去掉主要内容上定义的宽度。

<div id="container">
    <div id="sidebar">
        Sidebar Content
    </div>

    <div id="maincontent">
        Main Content
    </div>
</div>

#maincontent {
    float: left;
    border: 1px solid green;
    height: 400px;
}

#sidebar{
    float:left;
    width:200px;  
    border: 1px solid blue;
    top:10px;
    height: 200px;
}