标题平滑过渡到浮动标头

jquery
css

2013-04-28 54 views 0 likes

对于website I'm working on，我编写了以下JQuery将标头转换为浮动标头，以便人们滚动以便标头始终保持可见。我只是想知道是否有人知道如何使这个过渡更平滑。现在它发生得非常快，并不是很顺利。标题平滑过渡到浮动标头

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; 
}

来源

2013-04-28 farjam

尝试隐藏标题，然后添加类固定标题后，做一个淡入淡出或其他东西 – anpsmn 2013-04-28 16:42:22

这是一个很好的方法;不过，我只是希望能够在第一次离开常规标题时顺利过渡。当你继续滚动时，我希望头部保持在顶部而没有任何闪烁。 – farjam 2013-04-28 16:49:46

回答

为什么需要过渡？

只需将标题始终保持为浮动模式，您甚至不需要javascript在一种模式和另一种模式之间切换。当用户位于页面顶部时，标题也将位于顶部。只需使用position: fixed。

来源

2013-04-28 16:50:18 Saturnix

不能争辩:) – farjam 2013-04-28 16:56:02

顺便说一句，你一定非常小心。位置：固定是与狩猎手机导航屁股疼痛。查看我在iPad浏览器中使用页脚时遇到的问题：http://stackoverflow.com/questions/14967641/position-fixed-only-on-height – Saturnix 2013-04-28 16:58:37

和google：http://www.google.it/search ？q =位置+固定+ ios – Saturnix 2013-04-28 16:59:09

标题平滑过渡到浮动标头

回答

相关问题