css - 在 WordPress 中创建固定导航菜单

Question

如何修复（滚动时固定在顶部）我的 WordPress 驱动网站的导航菜单，如 TechCrunch.com？

Answer 1

要始终将您的导航保持在网站顶部，请为您的菜单容器使用以下 css：

left: 0;
top: 0;
position: fixed;
padding: 5px 0;
width: 100%;
text-align: center;

然后，如果用户向下滚动，您可以使用一些 JavaScript 来更改徽标大小。我建议使用 jQuery 库检查导航栏位置，更改它的位置以防用户滚动超过导航顶部的高度，使其保持在窗口顶部，当然当用户滚动时重复整个过程。

你可以在这里找到好的和简单的教程

jQuery 代码需要放在你的 header.php 文件中，首先是附加 jquery 库<script type="text/javascript" src="/scripts/jquerylibrary.js"></script>，然后将你的代码放在<script>标签中，也放在 header php 中