语义 UI 特殊弹出窗口未显示

Semantic-UI Special PopUp not showing

本文关键字:窗口 显示 UI 语义      更新时间:2023-09-26

我正在尝试使用自定义 html 构建一个特殊的弹出窗口,以便稍后向其添加内容......

我的控制台显示此消息 = 弹出窗口:找不到弹出窗口的可见位置。

$(document)
  .ready(function() {
    $('.item.messages')
      .popup({
        inline: true,
        hoverable: true,
        popup: '.special.popup',
        position: 'bottom left',
        delay: {
          show: 300,
          hide: 800
        }
      });
  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a class="item messages">
  <i class="mail icon"></i>	
  <div class="ui special popup">
    <div class="header">Custom Header</div>
    <div class="ui button">Click Me</div>
  </div>
</a>

有什么想法吗?

试试这段代码它会起作用,你需要调用

div来弹出
 $(document)
      .ready(function() {
        $('.special.popup')
          .popup({
            inline: true,
            hoverable: true,
            popup: '.special.popup',
            position: 'bottom left',
            delay: {
              show: 300,
              hide: 800
            }
          });
      });
setTimeout(function(){
 $('.item.messages')
  .popup({
    inline: true,
    hoverable: true,
    popup: '.special.popup',
    position: 'bottom left',
    delay: {
      show: 300,
      hide: 800
    }
  });
 }, 1000);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a class="item messages">
  <i class="mail icon"></i> 
</a>
<div class="ui special popup">
   <div class="header">Custom Header</div>
   <div class="ui button">Click Me</div>
</div>

试试这个。结合上述阿马尔的解决方案。我相信最好在容器外放置弹出的div。