jquery - 标题平滑过渡到 float 标题

Question

对于website I'm working on ，我编写了以下 JQuery 以在人们滚动时将 header 转换为 float header ，以便 header 始终保持可见。我只是想知道是否有人知道有什么方法可以使这种过渡更顺利一些。现在它发生得非常快，而且不是很顺利。

JQuery:

$(window).scroll(function(){
    var header = $("#header");
    var top = $(window).scrollTop();
    if (top > 125) {
        header.addClass('fixed-header');
    }
    else{
        header.removeClass('fixed-header');
    }
}); 

CSS:

.fixed-header{
    position: fixed; 
    width: 980px;
}

Answer 1

为什么需要转换？

只需将 header 始终保持在 float 模式，您甚至不需要 javascript 在一种模式和另一种模式之间切换。当用户在页面顶部时，页眉也将在顶部。只需使用 position: fixed。