制作bootstrap导航栏消失并重新出现

Question

我试图弄清楚当向下滚过页面的第一部分并重新出现在某一点时，如何使导航条中的导航栏消失。任何帮助表示赞赏！

HTML：

 <div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
      <span class="sr-only">Toggle navigation</span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="#">Waymond</a>
  </div>
  <div class="collapse navbar-collapse">
    <ul class="nav navbar-nav">
      <li class="active"><a href="#">attending organizations</a>
      </li>
      <li><a href="#about">shop</a>
      </li>
      <li><a href="#contact">blog</a>
      </li>
      <li><a href="#contact">contact</a>
      </li>
      <li><a href="#contact">womp</a>
      </li>
      <li><a href="#contact">friends</a>
      </li>
      <li><a href="#contact" class="cta">help</a>
      </li>
    </ul>
  </div>
  <!--/.nav-collapse -->
</div>

这是我失败的js：

$(window).scroll(
{
    previousTop: 0
},
function () {
   var currentTop = $(window).scrollTop();
   if (currentTop < this.previousTop) {
       $(".navbar").hide();
   } else {
       $(".navbar").show();
    }
    this.previousTop = currentTop;
});