Jquery 平稳地改变元素的位置

当向下滚动页面时，我希望将菜单平滑地移动到页面顶部，并将其位置更改为粘滞。使用下面的代码，我可以使菜单在滚动时淡入

我怎样才能使它平稳地向上移动，然后保持在那里而不是突然消失

这是我的密码：

jQuery:

$(function(){

    var menu = $('#menu'),
        pos = menu.offset();

        $(window).scroll(function(){
            if($(this).scrollTop() > pos.top+menu.height() && menu.hasClass('default')){
                menu.fadeOut('fast', function(){
                    $(this).removeClass('default').addClass('fixed').fadeIn('fast');
                });
            } else if($(this).scrollTop() <= pos.top && menu.hasClass('fixed')){
                menu.fadeOut('fast', function(){
                    $(this).removeClass('fixed').addClass('default').fadeIn('fast');
                });
            }
        });

});

.fixed {
    position: fixed;
    top: -5px;
    left: 0;
    width: 100%;
}

演示：

---

如果您从jquery函数中删除淡出，您应该实现您想要的：

$(window).scroll(function(){
    if($(this).scrollTop() > pos.top+menu.height() && menu.hasClass('default')){
        menu.removeClass('default').addClass('fixed');
    } else if($(this).scrollTop() <= pos.top && menu.hasClass('fixed')){
        menu.removeClass('fixed').addClass('default');
    }
});

$（窗口）。滚动（函数（）{
if（$（this.scrollTop（）>pos.top+menu.height（）&&menu.hasClass（'default'））{
menu.removeClass（'default'）.addClass（'fixed'）；
}如果（$（this）.scrollTop（）@Pete，您应该应用您的示例作为答案。