semantic-ui - Semantic-UI：两个侧边栏冲突，一次只有一个？

Question

所以，我有一个页眉和一个页脚：

<div id='footer' class="ui bottom sidebar">
<div id='header' class='ui top sidebar'>

而且，JS：

$('#header').sidebar('show');
$('#footer').sidebar('show');

问题是同时显示两个侧边栏会导致重新调整第一个侧边栏。据我所见，语义使用边距将元素推入或移出屏幕，大概是通过某种 CSS 过渡。通过激活页脚，它似乎将页眉推离了屏幕。修复标题对这种情况没有帮助。如何让两个侧边栏同时处于活动状态而不会发生冲突？

有什么建议么？

score 3 · Accepted Answer

默认情况下，Semantic UI Sidebar 模块是独占的；换句话说，一次只能打开一个。当显示新的侧边栏时，语义将自动隐藏其他侧边栏。

您可以通过像这样配置侧边栏来更改此行为：

$('.ui.sidebar').sidebar({
    exclusive: false
});
$('.ui.sidebar').sidebar('show');

此 Javascript 将导致您的两个侧边栏都设置为非排他性，然后同时显示它们。此功能在 Sidebar 模块的语义 UI 文档中有所说明：

1 回答 1