我已经创建了一个页面,其中第二个导航栏在滚动时出现,并且应该在窗口位于顶部时隐藏:0。刷新页面时,导航栏可见,然后在滚动到时消失然后出现在设置为出现的scrollPos上。
如何在刷新页面时隐藏它?
网页是www.fareastfestival.com请看看帮助。
这是我使用过的JS代码:
$(document).ready(function() {
var navOffset = $("nav1").offset().top;
$("nav").wrap('<div class="nav-placeholder"></div>');
$(".nav-placeholder").height($("nav").outerHeight());
$(window).scroll(function(){
var scrollPos = $(window).scrollTop();
if (scrollPos >= navOffset) {
$("nav").removeClass("hide");
$("nav").addClass("fixed");
$(".navlogo").show();
}
else {
$("nav").addClass("hide");
$("nav").removeClass("fixed");
$(".navlogo").hide();
}
});
});
答案 0 :(得分:0)
将隐藏类添加到html文件中的导航,如<header>
<img src="yo.png">
<h1 class="oo">omargonzalesdiaz.com</h1>
<nav>
<ul id="menusuperior">
<li class="seccion"><a href="/">Inicio</a></li>
<li class="seccion"><a href="/events">Blog</a></li>
<li class="seccion"><a href="/events">Dashboards</a></li>
<li class="seccion"><a href="/events">Contáctame</a></li>
</ul>
</nav>
</header>
答案 1 :(得分:0)
只需将.hide类添加到HTML元素即可。 这是一个例子(第7行):
$(document).ready(function() {
var navOffset = $("nav1").offset().top;
$("nav").wrap('<div class="nav-placeholder"></div>');
$(".nav-placeholder").height($("nav").outerHeight());
$("nav").addClass("hide");
$(window).scroll(function(){
var scrollPos = $(window).scrollTop();
if (scrollPos >= navOffset) {
$("nav").removeClass("hide");
$("nav").addClass("fixed");
$(".navlogo").show();
}
else {
$("nav").addClass("hide");
$("nav").removeClass("fixed");
$(".navlogo").hide();
}
});
});
上面的代码动态地添加了这个类。您也可以添加到HTML中。