一个页面的网站导航栏突出显示部分（使用bootstrap）？

Question

我正在为我的单页网站使用bootstrap和smoothscroll。我不确定如何让导航栏中的部分变为活动状态，但如果有人滚动它 - 对此有任何帮助吗？我知道如何在点击时突出显示但不确定位置

<div class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>

      <!-- nav bar -->
      <div class="navbar-brand"><b>Merisa Lee</b></div>
    </div>
    <div class="navbar-collapse collapse" style="height: 1px;">
      <ul class="nav navbar-nav">
        <li><a href="#home" class="smoothScroll">Home</a></li>
        <li><a href="#about" class="smoothScroll">About</a></li>
        <li><a href="#work" class="smoothScroll">Work</a></li>

          </ul>
        </li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="resume.pdf">Resume</a></li>    
    </div><!--/.nav-collapse -->
  </div>
</div>