Fade in/out div scrollTop

Question

У меня есть плавающее меню, которое я хочу затухать, когда вы начинаете прокручивать страницу вниз, а затем исчезаете, когда вернетесь наверху страницы. У меня есть работа без выцветания, но я не уверен, как добавить затухания. Любая помощь оценивается. Благодарю.

$(document).scroll(function() { 
    $('#floatingnav').toggle($(this).scrollTop()>250) 
}); 

CSS

#floatingnav { 
    position:fixed; 
    display:none; 
} 

Answer 1

Вы можете использовать fadeToggle с некоторой длительностью в качестве аргумента (только упаковывают вы хотите) вместо плоскости toggle.That будет делать свою работу.

$(document).scroll(function() { 
    $('#floatingnav').fadeToggle($(this).scrollTop()>250) 
}); 

Answer 2

Вы можете попробовать это, чтобы проверить, если div достиг верхней

$(window).scroll(function() { 
    var d = $('div'); // this is your fixed div 
    if (d.offset().top > 250) { 
     d.fadeIn(); 
    } else { 
     d.stop().fadeOut(); 
    } 
}); 

TEST FIDDLE

Answer 3

$(window).bind("scroll", function() { 
    if ($(this).scrollTop() > 250) { 
     $("#floatingnav").fadeIn(); 
    } else { 
     $("#floatingnav").stop().fadeOut(); 
    } 
});