jquery透明导航栏仅在第一页上

Question

我制作了一个jquery脚本，它使我的导航栏来自transparent - color，我想知道我是否只能在第一页上实现这一点。

此外，我想说我从控制器加载我的页面，所有页面都是相同的页眉，页脚。

var OFFSET_TOP = 50;
$(window).scroll(function () {
  if ($('.navbar').length) {
    if ($('.navbar').offset().top > OFFSET_TOP) {
      $('.scrolling-navbar').addClass('top-nav-collapse');
    } else {
      $('.scrolling-navbar').removeClass('top-nav-collapse');
    }
  }
});

CSS

.top-nav-collapse {
  background-color: #23c0e9;
  min-height: 3rem;  
}

Answer 1

所以，这样做应该有不同的方法，

我推荐的是

$(window).scroll(function(){
        if($(document).scrollTop()>50) {
            $('.navbar').addClass('shrink');
        }
        else {
            $('.navbar').removeClass('shrink');
        }
    });

和.navbar .shrink的我的css是

.navbar .shrink { 
    background-color: rgba(0, 0, 0, 0.92);
    height: 50px;
}