想用jq判断滚动条滚到超过一定高度导航贴顶的怎么在谷歌浏览器会闪烁的？

Question

我是这样写的$(window).scroll(function () {
      var pos = $(window).scrollTop();
    if (pos > 69) {
        $('#topnav').addClass('navbar-fixed-top');
    }else{
     $('#topnav').removeClass('navbar-fixed-top');
    }
});

Answer 1

闪烁的原因基本都是因为高度的监控问题，建议不要使用jq的scroll
举个例子
topnav的高度是100
你希望监控>100就贴顶
当大于100的时候，由于fix之后原nav的dom位置出现脱离意思是会导致scroll获取当前滚动条高度出现丢失nav高度，即当前滚动条高度不计算nav
所以当前你以为大于100，实际是0，然后触发addClass和removeClass都会出发scroll事件，不断的add,remove就达到了闪烁问题
你会发现只有滚动条高度大于200才不会闪烁，因为大于200的时候，fix类出现，当前的滚动条高度是200-100即大于100，所以没有再出现remove