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

Question

当您第一次访问该页面时，我的博客。 (实际屏幕截图)

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

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

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

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

是否有插件可以做到这一点？

提前致谢。

Answer 1

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

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

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

希望你能理解我的逻辑。