0
我一直在网站上的移动版本有一个固定的标题,我想获得同样的效果,而滚动下来隐藏导航,仅当您滚动超过5个像素时才显示它。Teehan&Lax隐藏标题与JavaScript - 隐藏向下滚动,显示在向上滚动
就像teehanlax.com。我用一些我在网上找到的代码给了它一个镜头,但它表现很奇怪。它隐藏在向下滚动,但只是再次显示,看似...随机。
这是我的代码。
//Hide Header on on scroll down
$(function(){
var lastScrollTop = 0, delta = 5;
$(window).scroll(function(event){
var st = $(this).scrollTop();
if(Math.abs(lastScrollTop - st) <= delta)
return;
if (st > lastScrollTop){
// Scroll Down
$("header").delay(100).queue(function() {
$(this).addClass("animated fadeOutUp");
$(this).dequeue();
});
} else {
// Scroll Up
$('header').delay(100).queue(function() {
$(this).removeClass("fadeOutUp").addClass("animated fadeInDown");
$(this).dequeue();
});
}
lastScrollTop = st;
});
});
我最终放弃了它。这似乎并不值得。 – 2013-06-07 18:31:47