向下滚动时，菜单拆分并固定到顶部

Question

当您第一次访问该页面时我的博客。 （实际截图）

当用户向下滚动时会发生什么（实际屏幕截图；目前没有什么特别的事情发生）

这就是我希望发生的事情（经过编辑的屏幕截图）。

请有人指出我正确的方向，也许是一个教程/让我知道这种“技术”的术语是什么。我确信可以在 jQuery/CSS 中执行此操作，但我不确定我需要搜索什么。

我正在运行 Wordpress，Michael Norris 是标题文本，Menu 是由 Wordpress 菜单编辑器创建的导航菜单。

有没有插件可以做到这一点？

提前致谢。

Answer 1

1. 需要检测滚动事件，可以在jQuery中使用.scroll()来完成
2. 一旦它们开始滚动，您必须将位置更改为元素块的FIXED。为此，您可以使用.css()

我认为你有这样的，如果没有尝试将它包装在一个 div 中

<div class=wrapper></div>
<h1>Michael Norris</h1>
<ul>
 <li>Home</li>
 ....
 ....
</ul>
</div>

希望你能理解我的逻辑。