Question

只是第一个＆＃34;否则＆＃34;不工作当向下滚动时，topColor div将从原来的15高扩展到150高，但当我在顶部滚动时不会缩回到15高。

$(document).ready(function () {
    $(window).scroll(function () {
        if ($(this).scrollTop() > 20) {
            $('#topColor').animate({
                height: "150px"
            });
        } else {
            $('#topColor').animate({
                height: "15px"
            });
        }
        if ($(this).scrollTop() > 300) {
            $("#fixedMenuBar").fadeIn('slow', 'linear');
        } else {
            $("#fixedMenuBar").fadeOut('fast', 'linear');
        }
    });
});

Answer 1

你不应该在滚动回复动画中使用else，而是使用else if来更具体，animate会产生冲突，因为滚动值总是会改变而jQuery不能无限重复动画。

但如果你坚持animate试试这个：

    var scrollVal = $(this).scrollTop();

    if ( scrollVal < 20 )
      if ( $("#fixedMenuBar").is(':visible') ) {
        $("#fixedMenuBar").fadeOut('fast', 'linear');
      }
      if ( parseInt($('#topColor').css('height')) != 150 ) {
        $('#topColor').animate({ height: "150px" });
      }

    }else if ( scrollVal >= 20 && scrollVal < 300 ) {
      if ( $("#fixedMenuBar").is(':visible') ) {
        $("#fixedMenuBar").fadeOut('fast', 'linear');
      }
      if ( parseInt($('#topColor').css('height')) != 15 ) {
        $('#topColor').animate({ height: "15px" });
      }

    }else if ( scrollVal >= 300 ) {
       if ( !$("#fixedMenuBar").is(':visible') )
        $("#fixedMenuBar").fadeIn('slow', 'linear');
    }

这个答案也可以帮到你：Setting CSS value limits of the window scrolling animation

动画高度 - 其他不起作用

1 个答案: