jquery - HTML/CSS 左滑菜单

Question

我正在构建一个网站，我希望菜单从屏幕左侧 (width:0px) 向右滑动 (width:250px) 动画使用 jQuery。

我所做的是创建一个容器div，里面有两个div #menuLeft 和#content。

然后我的问题是，如何使 #content's 的宽度等于 css 中屏幕的剩余部分，知道我的容器是 100% 宽度，并且 #menuLeft 是可变的。

非常感谢!

HTML:

<div id="all">
    <div id="leftMenu">
    </div>

    <div id="content">
    </div>

</div>

CSS:

#all{
    position:absolute;
    top:0px;
    left:0px;
    background:#445566;
    margin:0 auto;
    padding-top:40px;
    width:100%;
    height:2000px;

}

#leftMenu{
    float:left;
    background:#888888;
    height:1000px;
    width:250px;
}
#content{

    float:right;
    height:1000px;
    background:#55ffaa;
    width:1000px;
}

Answer 1

您是否正在尝试实现以下目标:this ？

代码如下:

<div id="all">
    <div id="leftMenu"></div>
    <div id="content">some text</div>
</div>

CSS:

#all{
    position:absolute;
    top:0px;
    left:0px;
    background:#445566;
    margin:0 auto;
    padding-top:40px;
    width:100%;
    height:2000px;
}
#leftMenu{
    float:left;
    background:#888888;
    height:1000px;
    width:250px;
}
#content{
    height:1000px;
    background:#55ffaa;
}

尝试调整结果面板或浏览器的大小。