Bootstrap - Hover Popover也可以使用data-container = body闪烁

Question

我正在使用带jQuery的Bootstrap插件。

Hover Flickering for Bootstrap Popover存在问题...我尝试过以下选项，但问题仍然存在

尝试的选项：

1. $('.article-content').popover();
2. $( document ).ready(function() { $('.article-content2').popover(); });
3. data-container="body"

HTML

<article>

<span class="article-content" href="#" data-content="Popover with Hover" rel="popover" data-placement="bottom" data-original-title="Title" data-trigger="hover">Mouse Over</span>        
<span class="article-content2" href="#" data-content="Popover with with Document Ready" rel="popover" data-placement="bottom" data-original-title="Title 2" data-trigger="hover">Mouse Over with Document Ready</span>        
<span class="article-content2" href="#" data-content="Popover with with Document Ready &amp; data-container=body" rel="popover" data-placement="bottom" data-original-title="Title 3" data-trigger="hover" data-container="body">Mouse Over with Document Ready &amp; data-container="body"</span>

</article>

CSS

body{margin:50px;}    
article span{background:#ddd;width:100%;float:left;border-top:1px solid #ccc;border-bottom:1px solid #ccc;padding:5px;text-align:center;cursor:pointer;margin-bottom:1px;}

的jQuery

$('.article-content').popover();

$( document ).ready(function() {
    $('.article-content2').popover();
});

FIDDLE

感谢@mijopabe，我们只需要添加＆＃34; 淡出淡出＆＃34; CSS类，如果我们没有。完全不知道这种关系，但它就像一个冠军。

HERE IS WORKING FIDDLE

要添加额外的CSS类以消除闪烁

.fade {
   opacity: 0;
   -webkit-transition: opacity 0s linear;
      -moz-transition: opacity 0s linear;
       -ms-transition: opacity 0s linear;
        -o-transition: opacity 0s linear;
           transition: opacity 0s linear;
 }