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;
}

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

HTML / CSS左侧滑动菜单

1 个答案: