jquery - DIV(位置 :absolute) getting overlapped on jquery . slideToggle

标签 jquery html css positioning overlapping

我是 Web 开发的新手,现在我正在把头钻进墙里。我知道我遗漏了一些重要且可能非常简单的东西。这是我的代码:

HTML:

<html>
<head></head>

<body>
    <div id='content'>

        <div id='leftColumn'>php includes</div>
            <script></script>  //jQuery script to slideToggle a div on the leftColumn.
        <div id='page'>php includes</div>

    </div>
    <div id='footer'>php includes</div>
</body>

</html>

CSS:

#leftColumn {
        position:absolute;
        left:0;
        top:70px;
        width:200px;
}
    #leftColumn1 {
        position:relative;
        z-index:1;
    }
    #leftColumn2 {
        position:relative;
        z-index:1;
    }
#content {
        z-index:-1;
        width: 100%;
        padding-top:0px;
}
#footer {
    position:absolute;
        bottom:1px;
    width: 100%;
    margin: auto;
}

当我切换 sideColumn div 出现时,页脚停留在页面底部的位置可能是由于

#footer {
    position:absolute;
        bottom:1px;

#sideColumn 下降(就像它应该的那样)并与#footer 重叠(就像它不应该的那样)。我一直在搞乱这些元素的位置,但无济于事。有什么建议或指点我可以在哪里阅读现有解决方案吗?提前致谢。

fiddle : <强> http://jsfiddle.net/ETHER34L/ymsuv0m6/3/

最佳答案

上次我编写 html w3schools 使这一切都变得“点击”。

w3schools css reference

我不知道你在想象什么,所以我会把修补留给你......我会尝试不同的属性值,看看会发生什么。

关于jquery - DIV(位置 :absolute) getting overlapped on jquery . slideToggle,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25272941/

相关文章:

jquery - Angular 自定义指令在输入字段更改时调用函数

javascript - 更改#anchor 的默认起始位置

javascript - 静止图像重​​叠 jquery 图像幻灯片

html - 如何用CSS划分内容的偶数、奇数?

javascript - 如何在 jQuery 中更改事件 img 源时更改类

javascript - 如何解决同位素中的追加设计问题?

javascript - 从下拉元素中选择的选项不可见

javascript - 从 javascript 引用 div - jsfiddle 失败

javascript - 如何使用 localStorage.setItem 存储结果并使用 'PlayerName' 和 'TotalScore' 创建表

整个页面的 CSS3 第 nth-of-type?