Question

我试图在div的顶部被击中时看到一个粘性标题，然后在击中下面第二个div的顶部时看不见

我无法弄清楚我的代码有什么问题：

var iconsetTop = $('.icon-sets').offset().top;
var bundleTop = $('.bundle-offer').offset().top;

$(window).on( 'scroll', function(){
    if ((iconsetTop >= $(window).scrollTop()) && (bundleTop >= $(window).scrollTop())){
        $('.set-header').css("top","-20%");
    } else {
        $('.set-header').css("top","0");
    }  
});

我认为使用＆amp;＆amp;＆amp;和运营商，但我无法找到什么。另外，我创建了en codepen来说明：http://codepen.io/jeremyobriot/pen/zqdpyJ

感谢提前帮助！

Answer 1

你是说这个意思吗？标题只在红色框内可见。

我发了一个声明，我问这个窗口的scrollTop是否高于iconset顶部和低于捆绑顶部。

＆＃13;

var iconsetTop = $('.icon-sets').offset().top;
var bundleTop = $('.bundle-offer').offset().top;

$(window).on('scroll', function() {
  if ($(window).scrollTop() >= iconsetTop && $(window).scrollTop() <= bundleTop) {
    $('.set-header').css("top", "0");
  } else {
    $('.set-header').css("top", "-20%");
  }
});

＆＃13;

body {
  margin:0;
}

.set-header {
  height: 50px;
  background-color: black;
  position: fixed;
  width: 100%;
  top: -20%;
}

.space {
  height: 100px;
  background-color: blue;
}

.icon-sets {
  height: 500px;
  background-color: IndianRed;
}

.bundle-offer {
  height: 1000px;
  background-color: pink;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="set-header"></div>
<div class="space"></div>
<div class="icon-sets"></div>
<div class="bundle-offer"></div>

＆＃13;

如何在滚动到另一个div的顶部后显示div？

1 个答案: