菜单在滚动上切换

Question

这是我的问题。

当您向下滚动页面时，我正在尝试进行弹出或向下滑动或淡入（无论如何）的导航。我遇到的问题是，在一个页面（索引页面）中我有一个视频背景，当你向下滚动时滚动导航根本不显示，在其他没有视频的页面上工作正常。

代码：

var num = 300;

$(window).bind('scroll', function() {
  if ($(window).scrollTop() > num) {
    $('#topSmallNav').addClass('showtopbar');
  } else {
    $('#topSmallNav').removeClass('showtopbar');
  }
});

video#bgvid {
  position: fixed;
  top: 0;
  left: 0;
  min-width: 100%;
  width: auto;
  height: auto;
  z-index: -10;
  background-position: top center;
}
.showtopbar {
  display: block!important;
  z-index: 9999999999999999;
}

<div id="topSmallNav">
  <a href="#">Tryout</a>
</div>
<video autoplay loop preload="auto" id="bgvid">
  <source src="video/girl.web" type="vide/web">
    <source src="video/girl.mp4" type="video/mp4">
</video>