Question

经过大量搜索，我没有找到解决方案。我的问题是这样的：我的页面上有一个固定的顶部栏，而另一个div恰好在固定的栏下面，这两个div之间的距离为150px-400px，具体取决于屏幕分辨率。

我想做的是，当固定div的底部接触第二个div的顶部时，向第二个div添加一个新类（一些阴影）。我知道我可以使用类似的东西：

$(function(){
$(window).on('scroll', function(){
   if($(this).scrollTop() > 150){
       $('.content').addClass('shadow');
   }else{
       $('.content').removeClass('shadow');
   }
}).scroll();
});

，但仅当2个div之间的间距为150px时才有效。我该如何做，以便固定的div知道何时触及第二个div的顶部？

FIDLLE HERE

Answer 1

尝试一下：

$(function(){
  $(window).on('scroll', function(){

     var contentTop = $('.content').offset().top;
     var hHeight = $('.header').height();

     if($(this).scrollTop() > contentTop-hHeight){
         $('.content').addClass('shadow');
     }else{
         $('.content').removeClass('shadow');
     }
  }).scroll();
});

当固定div的底部接触此div的顶部时，使用jquery将类添加到特定的div

1 个答案: