css/jquery scroll-fixed div问题

Question

我试图在窗口的浏览器向下滚动时以及在窗口向上滚动时将某个像素固定在一个像素后，将div放在开头的相同位置。

$(window).scroll(function() { 
    var button = $('.button-mobile'); 
    offset = button.offset().top; 
    position = button.position().top; 
    console.log(position); 
    if ($(this).scrollTop() >= offset) { 
     $('.button-mobile').css({ 
      "max-height": "100%", 
      "position": "fixed", 
      "overflow-y": "auto", 
      "top": "40px", 
      "z-index": "1" 
     }); 
    } else { 
     $('.button-mobile').css({ 
      "position": "absolute", 
      "top": "none", 
      "overflow-y": "none", 
      "z-index": "none" 
     }); 
    } 
}); 

if分行运作良好。 else分支是我想的问题。

这个分支是一个先验实验的测试。 else分支在px中以已知高度工作，但不会与频繁更改的偏移量一起工作。

另外我不知道为什么当窗口向下滚动到div的位置的最高值设置为40px。

感谢

Answer 1

，我想你应该搬到按钮和偏移分配了滚动回调：

var button = $('.button-mobile'); 
    var offset = button.offset().top; 

    $(window).scroll(function() { 
     position = button.position().top; 
     console.log(position); 
     if ($(this).scrollTop() >= offset) { 
      $('.button-mobile').css({ 
       "max-height": "100%", 
       "position": "fixed", 
       "overflow-y": "auto", 
       "top": "40px", 
       "z-index": "1" 
      }); 
     } else { 
      $('.button-mobile').css({ 
       "position": "static", 
       "top": "none", 
       "overflow-y": "none", 
       "z-index": "none" 
      }); 
     } 
    });