在进度条中弹出

Question

因此，我希望在单击进度条时在进度条下方显示“弹出”选项卡。目前，当我单击进度条时，我能够启动Popover，并且进度条似乎与附加的附加功能一样正常工作。

我遇到的问题是，当您单击“进度”栏以显示“弹出窗口”时，该选项卡位于栏中？好像酒吧重叠然后切掉其余的Popover，所以我只能看到进度条的一半和popover的一半白盒子。由于进度条覆盖了弹出窗口，无法看到任何文本。

单击进度条时，弹出窗口应显示在进度条下方？关于如何解决这个问题的任何想法？这是我的代码：

a

Answer 1

我确实想知道如何在稍微调整脚本之后完成此操作，Popover必须位于进度条div之外且添加了data-placement：

<a href="#" data-toggle="popover" data-placement="bottom" title="Popover Header" data-content="Some content inside the popover">
 <div class="progress">
  <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width: 50%;">

    <span style="position:absolute; right:0; left:0; top: 0; z-index: 2; text-align: center; width: 100%; color:#333; alignment-adjust:middle;">Add display Image</span>

  </div>
</div>
</a>
 <script>
$(document).ready(function(){
    $('[data-toggle="popover"]').popover();   
});
</script>