jquery - SlideUp 回调不向元素添加类

Question

当我滚动页面时，我想为页眉设置动画。它应该slideUp，添加一个类和slideDown。

slideUp 和 slideDown 按预期工作，但未添加类 header-small。怎么会？

$(function() {
  var moved = false,
      header = $('header');
  $(window).scroll(function() {
    if ($(document).scrollTop() > 20) {
      if (moved == 'false') {
        header.slideUp(500, function() {
          $(this).addClass('header-small').slideDown('slow');
        });
        moved = true;
      }
    } else {
      header.slideUp(500, function() {
        $(this).removeClass('header-small').slideDown('slow');
      });
      moved = false;
    }
  });
});

body,
html {
  height: 300%;
}

header {
  position: fixed;
  height: 2em;
  background: lightblue;
  top: 0;
  left: 0;
  width: 100%;
}

.header-small {
  font-size: .75em;
  background: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<header>
  This is a header with text
</header>

我尝试将 $(this) 更改为 $('header')，但结果相同。

Answer 1

你已经实现了 string ，应该是不带引号的 bool 值，比如 false

如果(移动 == 'false')