使用jQuery滚动时更改div内容

Question

我右侧有一个固定的div框，我想这样做，以便当页面滚动时，框中的内容会根据左边的内容进行更改，因为我需要一些帮助，因为我需要一些帮助我不知道如何使用jQuery做到这一点。

这是我的意思的动画示例：

Answer 1

你可以通过听jQuery滚动事件来做到这一点。

当触发滚动时，应检查当前滚动位置是否等于您希望更改发生的位置。

Answer 2

此问题通过努力显示非常少，但只是为了让您启动，您可以使用Bootstrap Scrollspy然后隐藏任何链接active上课。

如果这不符合您的需求，请以此为出发点，以便在将来提出更具针对性的问题。

Demo in Fiddle

1. 首先，将所有节标题设置为列表项，如下所示：

   <div id="sidebar">
       <ul class="nav">
           <li><a href="#Content1">Content 1</a></li>
           <li><a href="#Content2">Content 2</a></li>
           <li><a href="#Content3">Content 3</a></li>
       </ul>
       Lorem Ipsum
   </div>
   

2. 然后将scrollspy添加到页面，定位您刚刚创建的#sidebar

   $('body').scrollspy({ target: '#sidebar' })
   

3. 然后将所有li设置为隐藏，但覆盖活动的#sidebar li { display: none; } #sidebar li.active { display: block; } 以使其可见：

   {{1}}

截图：