jquery - 带有 .css() 和 .fadeIn 的 FadeIn header

Question

我想在滚动页面时淡入我的标题。这是我到目前为止所得到的，除了 .fadeIn() 之外一切正常。

$(document).scroll(function() {
    if( $(this).scrollTop() > 120 ) {
        if( !fixed ) {
            fixed = true;
            $('.mini-logo').css({display:'block'});
            $(' header ').css({background:'#323232'});
        }
    } else {
        if( fixed ) {
            fixed = false;
            $('.mini-logo').css({display:'none'});
            $(' header ').css({background:'rgba(0,0,0,0)'});
        }
    }
});

Answer 1

你可以做一些像这样简单的事情 JSFiddle: http://jsfiddle.net/eYcL4/ :

var fixed = false;
$(document).scroll(function() {
    if( $(this).scrollTop() > 120 ) {
        if( !fixed ) {
            fixed = true;
            $('.mini-logo').css({display:'block'});
            $('header').css({background:'#323232'});
            $('header').fadeOut();
        }
    } else {
        if( fixed ) {
            fixed = false;
            $('.mini-logo').css({display:'none'});
            $('header').css({background:'rgba(0,0,0,0)'});
            $('header').fadeIn();
        }
    }
});

但紧迫的问题是淡出标题会改变内容的高度(标题在隐藏时折叠为 0 高度)。

请说明您所追求的效果。