jquery - 修复了带有滚动条的菜单滚动并停在顶部

Question

菜单(黑色)是固定位置，偏移页眉的边距顶部高度。菜单偏移顶部边距在滚动时上升，但它也应该在到达顶部时停止。 demo link

$(window).scroll(function(){
  var y = $(window).scrollTop();
  var headerHeight = $('.header').height();
  var bgp = $(window).scrollTop();
   var result =  headerHeight-bgp;

  if(y > 0 ){
      $('.menu').css({'top': + result +'px'});  
  } else{
    $('.menu').css({'top': + headerHeight +'px'}); 
  }
});

Answer 1

这是您的预期输出:

$(window).scroll(function(){
      var y = $(window).scrollTop();
      var headerHeight = $('.header').height();
      var bgp = $(window).scrollTop();
      //var mtv = $('.menu').position().top;
       var result =  headerHeight-bgp;

      if(result > 0 ){
          $('.menu').css({'top': + result +'px'});  

      } else{
          console.log("stop");
        $('.menu').css({'top':  0}); 
      }
    });

检查 Fiddle Here.