如何将容器元素与scrollspy一起滚动？

<div class="container">
  <nav id="navbar-example" class="navbar">
    <ul class="nav">
      <li><a href="#section1">Section 1</a></li>
      <li><a href="#section2">Section 2</a></li>
      <li><a href="#section3">Section 3</a></li>
    </ul>
  </nav>
  <div data-spy="scroll" data-target="#navbar-example" data-offset="0">
    <section id="section1">
      <h1>Section 1</h1>
      <p>Content for section 1</p>
    </section>
    <section id="section2">
      <h1>Section 2</h1>
      <p>Content for section 2</p>
    </section>
    <section id="section3">
      <h1>Section 3</h1>
      <p>Content for section 3</p>
    </section>
  </div>
</div>

.container {
  height: 400px;
  overflow: auto;
}

$(function() {
  $('body').scrollspy({ target: '#navbar-example' });
});