语义 UI：禁用与模态关联的调光器

Question

我有一个接受一些用户输入的模式。如果用户得到正确的答案，他/她应该能够看到调光器后面的动画。我试过了

$('.basic.modal')
.modal('setting',{
    closable  : true,
    onDeny    : function(){},
    onApprove : function(){}
})
.modal('hide others')
.modal('show')
.modal('hide dimmer');

和

$('.basic.modal')
.modal('setting',{
    closable  : true,
    onDeny    : function(){},
    onApprove : function(){}
})
.modal('hide others')
.modal('hide dimmer')
.modal('show');

都不起作用。我该怎么办？

Answer 1

您可以通过将不透明度传递给 dimmerSettings 来隐藏调光器，如下所示：

$('#your-modal').modal({
  dimmerSettings: { opacity: 0 }
}).modal('show');

找到答案这里

Answer 2

模式显示后，您必须设置“隐藏调光器”。

$('.basic.modal')
.modal('setting',{
    closable  : true,
    onDeny    : function(){},
    onApprove : function(){}
})
.modal('hide others')
.modal('show')
.modal('hide dimmer');

Answer 3

这是解决这个问题的一种方法。

.ui.dimmer{
    background: transparent;
}

你最后是怎么解决的？

Answer 4

您可以像这样从 onShow 回调中删除调光器：

$('.modal').modal({
        duration: 10,
        onShow: function () {
            $('.modal').parent().removeClass('dimmer');
        }
    }).modal('show');
    ;