Question

我正在尝试使用标记来启动语义UI调光器：

<p id="move">Move me</p>

<div class="ui dimmable">

   <h3 class="ui header">
     Overlayable Section
   </h3>

   <div class="ui dimmer"></div>

</div>

和js喜欢这样：

$('.ui.dimmable')
  .dimmer(
    {on: 'click'},
    'add content', $('#move'))
;

显然有一种称为'add content'的行为应该从DOM中分离一个元素并将其添加到调光器中。

有没有人有关于如何使这项工作的想法？

注意 - 上面的内容确实点击了“.ui.dimmable”上的调光器，我只是无法掌握如何使用'行为'语义UI文档提及，并且找不到任何示例。

谢谢！

Answer 1

默认情况下，调光器内容为黑色，因此您需要将#move元素设为白色。我尝试使用h2

将其更改为.ui.inverted.header

然后您需要将您想要的内容添加到调光器中：

$(".ui.dimmable").dimmer("add content", $("#move"));

并将其配置为单击

显示

$(".ui.dimmable").dimmer({
    on: "click"
});

Try it on this JSFiddle

如何使用语义UI'添加内容'的JavaScript行为？

1 个答案: