javascript - 带有固定顶部菜单的语义 UI 侧边栏

Question

Semantic-UI 预先警告其 sidebar page “当侧边栏出现时，固定位置内容可能无法更改其位置。”然后它提供了两种可能的解决方案。

令人惊讶的是，在同一个页面和整个网站上，Semantic-UI 的网站使用了一个固定的顶部菜单，当左侧边栏被触发时，该菜单可以很好地调整。

我想简单地创建一个固定的顶部菜单，就像 Semantic-UI 的站点使用的那样，当侧边栏打开时可以正确调整。然而，这被证明是非常困难的，因为两个提议的解决方案都不起作用。我已经检查了标记、css 和 javascript，但无法弄清楚他是如何从 Semantic-UI 提供的代码转变为可在侧边栏打开时正确调整的工作固定顶部菜单的。

有什么想法或方向吗？使用 Semantic-UI 如何创建固定的顶部菜单，以便在打开侧边栏时正确调整？

Answer 1

来自文档:

Using Fixed Content Any fixed position content that should move with page content when your sidebar is visible, should receive the class name fixed and exist as a sibling element to your sidebar.

Fixed content that is not included adjacent to your pusher will lose its positioning when a sidebar is shown.

<div class="ui left vertical inverted labeled icon sidebar menu">
</div>
<div class="ui fixed inverted main menu">
</div>