答案 0 :(得分：1)
您可以向$.scrollTop()添加100，以查看元素距离页面顶部100px的时间，并且只有在显示它们时才会触发要隐藏的项目符号（反之亦然）。
$(document).ready(function() {
var lastDiv = $("#section4").offset().top,
$bullets = $('#bullets');
$(window).scroll(function() {
var st = $(this).scrollTop();
if (st + 100 >= lastDiv) {
$bullets.is(':visible') && $bullets.fadeOut(100);
}
else if ($bullets.is(':hidden')) {
$bullets.fadeIn(100);
}
});
});* {
padding: 0;
margin: 0;
}
#section1 {
width: 100%;
height: 100vh;
background-color: pink;
}
nav#bullets {
position: fixed;
top: 50%;
right: 15px;
z-index: 999;
transform: translateY(-50%);
background-color: rgba(0,0,0,0.5);
border-radius: 20px;
}
nav#bullets span {
cursor: pointer;
display: block;
height: 12px;
width: 12px;
border-radius: 50%;
margin: 15px 5px;
transition-duration: 0.5s;
}
nav#bullets span:after {
height: 8px;
width: 8px;
display: block;
content: "";
border: 2px solid white;
border-radius: 50%;
}
nav#bullets span:hover {
background-color: white;
transition-duration: 0.5s;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<nav id="bullets">
<a href="#section1"><span></span></a>
<a href="#section2"><span></span></a>
<a href="#section<nav id="bullets">
<a href="#section1"><span></span></a>
<a href="#section2"><span></span></a>
<a href="#section3"><span></span></a>
<a href="#section4"><span></span></a>
</nav>
<div class="section-wrapper">
<div id="section1" class="section" data-hash="a">
<div>
<h1>Slide 1</h1>
</div>
</div>
</div>
<div id="section4" class="footer">
<div>
<h1>Section 4</h1>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
</div>
</div>3"><span></span></a>
<a href="#section4"><span></span></a>
</nav>
<div class="section-wrapper">
<div id="section1" class="section" data-hash="a">
<div>
<h1>Slide 1</h1>
</div>
</div>
</div>
<div id="section4" class="footer">
<div>
<h1>Section 4</h1>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
<p>This section is not inside the section wrapper, so normal scrolling here!</p>
</div>
</div>