语义UI弹出位置很远

Question

我正在尝试使用Semantic UI的弹出模块,它在我的项目上的定位方面从未正常工作,因为它在演示中.我尝试了几次黑客攻击(设置位置relative等),但没有运气; 这是一个小提琴:http: //jsfiddle.net/smt94eox/ 我打算在按钮的左上方显示弹出窗口,因为它在盘旋:

$('#smile').popup({
    inline: true,
    hoverable: true, 
    position: 'top left'
});

但悬停时,弹出窗口显示在页面底部.有谁知道为什么以及如何解决这个问题？

Answer 1

根据文档

你不需要这个inline选项

使用 inline: true 设置会让 Semantic 知道在激活器之后显示下一个同级 ui 弹出元素。

如果删除内联选项并确保弹出窗口有空间，它将正确显示。http://jsfiddle.net/smt94eox/1/

<div id="smile" class="ui labeled icon button" title="You can see this" style="margin:100px">
    <i class="smile icon"></i>Click me first
</div>

$('#smile').popup({
    hoverable: true, 
    position: 'top left'
});