语义 UI 弹出框答案

【问题标题】：Semantic UI popover语义 UI 弹出框
【发布时间】：2014-08-29 12:45:54
【问题描述】：

我查看了整个Semantic UI demos，但找不到与Bootstrap Popovers 等效的语义UI。这些弹出窗口通常打开并连接到其切换开关，并且可以保持打开状态以供用户交互。

如果语义 UI 中不存在弹出框，人们建议改用什么设计/元素？基本想法是获得类似于“添加新指标”按钮in this design 的东西。

【问题讨论】：

如果您查看Popover Examples，则会出现一个模拟触发器的弹出窗口。这与 Bootstrap 弹出窗口非常相似。
太棒了，谢谢！我错过了这个，因为我只查看了“定义”选项卡。浏览他们的文档的一般提示。

标签： twitter-bootstrap popover semantic-ui

【解决方案1】：

正如Aibrean所说，已经有这样的功能，见Semantic Popup模块。

<div class="ui button" data-title="Lorem ipsum" data-content="Lorem ipsum dolor sit amet." data-position="right center">Click Me</div>

<div class="ui button" data-html="<div class='ui secondary vertical pointing menu'><a class='active item' href='#'>Home</a><a class='item' href='#'>Messages</a><a class='item' href='#'>Friends</a></div>">Click here</div>

<script type="text/javascript">
$('.button').popup({
    on: 'click',
    closable: false
});
</script>

这里是工作演示：http://jsfiddle.net/0q42ztp1/

【讨论】：

【解决方案2】：

语义 UI 现在有弹出提示。被问到这个问题时可能不存在，但它非常强大并且与 bootstrap 实现的相似。

https://semantic-ui.com/modules/popup.html

【讨论】：

哦，感谢您的评论！我最终使用了不同的库。但是语义看起来不再维护，我们正在考虑迁移到 Vuetify 或内部的东西。