语义-用户界面：两个侧边栏冲突，一次只有一个？ [英] Semantic-UI: Two Sidebars Conflict, Only One at a Time?

问题描述

因此，我有页眉和页脚：

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

和JS：

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

问题在于同时显示两个侧边栏会导致第一个侧边栏被重新调整。在我看来，语义使用边距将元素推送到屏幕上或屏幕外，大概是通过某种类型的CSS转换。通过激活页脚，它似乎可以将页眉从屏幕上推开。把表头修好也无济于事。如何才能使两个侧边栏同时处于活动状态而不会发生冲突？

有什么建议吗？

推荐答案

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

您可以通过如下方式配置侧边栏来更改此行为：

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

(Example jsFiddle)

该脚本将使您的两个侧边栏都设置为非独占，然后同时显示它们。此功能在边栏模块的语义用户界面文档中注明：

http://semantic-ui.com/modules/sidebar.html#/settings

这篇关于语义-用户界面：两个侧边栏冲突，一次只有一个？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！