我的索引文件中有一个 header ,定义如下:
<header id="header">
<div id="menu-trigger" class="header-button left icon-menu" ></div>
<h1><a class='current' href="index.html#home">Title</a></h1>
</header>
我设法在滚动时使其始终位于顶部静态:
$(function() {
console.log('Stick bar at top. . . ');
// Stick the #nav to the top of the window
var nav = $('#header');
var navHomeY = nav.offset().top;
var isFixed = false;
var $w = $(window);
$w.scroll(function() {
var scrollTop = $w.scrollTop();
var shouldBeFixed = scrollTop > navHomeY;
if (shouldBeFixed && !isFixed) {
nav.css({
position: 'fixed',
top: 0,
left: nav.offset().left,
width: nav.width(),
//z-index: 1;
});
isFixed = true;
}
else if (!shouldBeFixed && isFixed)
{
nav.css({
position: 'static'
});
isFixed = false;
}
});
});
问题是我加载到index.html 文件中的任何 View 都会出现在标题上方。我需要标题位于所有其他元素之上。
有办法做到这一点吗?或者我应该在重新加载所有 View 后重新加载标题?
谢谢
菲利普
最佳答案
CSS 属性 z-index : 1000 应该可以做到这一点。
您可以通过类以及 javascript/JQuery 来完成此操作。
关于javascript - 将静态标题保持在所有其他元素之上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28771355/