何时将类添加到固定的 div

Question

>我有一个固定的div，当它完全超过另一个div时，我想向它添加一个类。我已经设法根据第二个div 何时到达顶部来添加类，但它不是我想要的，因为我想根据它下面的div 添加类。

var distance = $('.Section-2').offset().top,
$window = $(window);
$window.scroll(function() {
if ( $window.scrollTop() >= distance ) {
$(".hamburger-box").addClass('orange');
}
	else {
		$(".hamburger-box").removeClass('orange');
	}
});

.hamburger-box {
position: fixed;
background: red;
width: 100px;
height: 100px;
}
.Section-1 {
height: 1000px;
background: blue;
}
.Section-2 {
height: 1000px;
background: green;
}
.orange {
background: orange;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="hamburger-box">
</div>
<div class="Section-1">
</div>
<div class="Section-2">
</div>

Answer 1

你可以像这样减去汉堡盒的高度

var distance = $('.Section-2').offset().top - $('.hamburger-box').outerHeight(),
$window = $(window);
$window.scroll(function() {
if ( $window.scrollTop() >= distance ) {
$(".hamburger-box").addClass('orange');
}
else {
$(".hamburger-box").removeClass('orange');
}
});