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

Question

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

Answer 1

为了让您的导航始终位于网站顶部，请为您的菜单容器使用以下 CSS:

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

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

您可以在here 中找到好的简单教程。

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