javascript - 滚动时固定标题和导航栏下的内容

标签 javascript jquery css

我希望在我的网站上滚动时固定标题和导航栏。我可以将它们都修复,但是 #container div 中的内容不会出现在它们下面。

我目前使用以下方法使我的网站内容显示在标题下方,但不确定如何计算 #header 和 #navbar id 的 margintop。

#header{
    width:100%;
    position:fixed;
    top:0px;
}

#navbar{
    width:100%;
    height:50px;
    margin:auto;
    position:fixed;
    top:120px;
}


$(document).ready(function () {
                    $('#container').css('marginTop', $('#header').outerHeight(true) );

                });

感谢您的帮助。

最佳答案

 $(document).ready(function () { $('#container').css('marginTop', $('#header').outerHeight(true) + $('#navbar').outerHeight(true) ); }); 

关于javascript - 滚动时固定标题和导航栏下的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15718456/

相关文章:

javascript - 如何让 ASP.net 在 JavaScript jQuery.Load 调用中填写本地服务器

css - 背景图像无法通过浏览器缩放正确调整大小

javascript - 模态窗口不滚动到底部

Javascript onmouseup 事件未按预期触发

javascript - 方法未添加到原型(prototype)

javascript - 如何将 jQuery MultiSelect 小部件设置为只读?

javascript - 调用另一个 html 页面后,选择列表值不会保持不变

javascript - 单击带有循环的 .append 中的 div

css - Bootstrap 3 缩略图间距

css - 当 style.css 中的 bookdown 字体发生变化时,Serif 不起作用