语义UI模态拖动

时间:2014-12-08 15:28:30

标签: modal-dialog semantic-ui

我希望用户能够将模式框拖动到不同的位置,就像使用JQuery UI对话框一样。

我在官方Semantic-UI文档中找到了modal的设置“可拆卸”,它似乎有我之后的描述。但是,即使将其设置为true似乎也不允许我拖动模态。有人可以帮我这个吗?

这是迄今为止的代码:

var aFunction = function()
{
    $('.modal').modal({detachable: true, closable: false, transition: 'fade up'});
    $("#aBtn").on("click", function(){
        $('.modal').modal('show');
    });
}
$(document).ready( aFunction );
<div class="ui basic large modal">
  <i class="close icon"></i>
  <div class="header">
    Archive Old Messages
  </div>
  <div class="content">
    <div class="image">
      <i class="archive icon"></i>
    </div>
    <div class="description">
      <p>Your inbox is getting full, would you like us to enable automatic archiving of old messages?</p>
    </div>
  </div>
  <div class="actions">
    <div class="two fluid ui inverted buttons">
      <div class="ui red basic inverted button">
        <i class="remove icon"></i>
        No
      </div>
      <div class="ui green basic inverted button">
        <i class="checkmark icon"></i>
        Yes
      </div>
    </div>
  </div>
</div>

1 个答案:

答案 0 :(得分:1)

Semantic UI目前不像JQuery UI那样支持可拖动的模态。

可分离选项的默认值已经为真,这意味着如果您打开一个新模态,前一个模式将被移动到背景(=调光器)并且不再可用(用深色可视化)。

相关问题