Question

我在浏览器窗顶上有一个固定的导航,我想在我 back回顶时,它会消失。

$(function(){

var didScroll = false;
var topbar = $( .topbar );
var $window = $(window);

function fadeOutScroll(){
    if(didScroll){
        if($window.scrollTop()>40){
            topbar.animate({ opacity : 0.4 }, slow );   
        }else{ 
            topbar.animate({ opacity : 1 }, 100 );  
        }           
        didScroll = false;
    }       
}

$window.scroll(function(){
    didScroll = true;
});

window.setInterval(fadeOutScroll,50);

});

It fades out when I scroll down, but when I go back to the top it doesn t fade in every time. It acts weird.

Answer 1

Try this. I hope it works not tested though

$(function(){

var didScroll = false;
var scrollUp = false;
var topbar = $( .topbar );
var $window = $(window);

function fadeOutScroll(){
    if(didScroll){
        topbar.animate({ opacity :(scrollUp? 1 : 0.4 )}, 100 );  
        didScroll = false;
    }       
}

$window.scroll(function(){
    didScroll = true;
    scrollUp = ($window.scrollTop() < 40);
});

window.setInterval(fadeOutScroll,50);

});

友情链接