Bootstrap彈出窗口需要一些功能

我有兩個自舉彈窗，他們應該可以打開側面板。Bootstrap彈出窗口需要一些功能

還請發現的jsfiddle https://jsfiddle.net/bob_js/eLLaacju/相關的代碼

我想達到以下問題：酥料餅應該data-trigger="hover"打開並保持，因爲它在其中，如果我們可以單擊文本內容（請點擊）它應該打開一個側面板。 data-trigger="focus"也沒有幫助。

您能否幫助我，下面是它的相關代碼。

HTML：

<div> 
Title 
</div> 
<div class="container"> 
<i id="popover-a" class="circle-macro" tabindex="0" data-container="body" data-html="true" data-trigger="hover" data-toggle="popover" data-placement="right">i</i> 

<div id="popover-content-a" class="hidden"> 
<div> 
    <h6><b>Heading</b></h6> 
    <p>Content <a href="#">Click Me</a></p> 
</div> 
</div> 
<br> 

<i id="popover-b" class="circle-macro" tabindex="1" data-container="body" data-html="true" data-trigger="hover" data-toggle="popover" data-placement="right">i</i> 

<div id="popover-content-b" class="hidden"> 
<div> 
    <h6><b>Heading</b></h6> 
    <p>Content <a href="#">Click Me</a></p> 
</div> 
</div> 

</div>

CSS：

.circle-macro { 
    border-radius: 50%; 
    background-color: rgb(68, 104, 125); 
    color: white; 
    padding: 0 8px; 
    font-family: 'Times New Roman'; 
    font-style: italic; 
    z-index: 10; 
    cursor: pointer; 
} 
.hidden{ 
    display: none; 
}

的jQuery：

$(function() { 
    $("#popover-a").popover({ 
    html: true, 
    content: function(){ 
     return $('#popover-content-a').html();  
    } 
    }); 
    $("#popover-b").popover({ 
    html: true, 
    content: function(){ 
     return $('#popover-content-b').html();  
    } 
    }); 
})

來源

2016-10-25 Bob

什麼側板？當我們點擊「點擊我」時，你想要發生什麼？ –

可能的重複[如何讓popstover popover保持活躍狀態？]（http://stackoverflow.com/questions/15989591/how-can-i-keep-bootstrap-popover-alive-while-the- -popover-being-being-hovered） – RSSM

是的，我需要點擊'點擊我'時會打開的東西 – Bob

只需添加下面我jQuery的幫助，現在的問題。

觸發： '點擊懸停'，延遲：{顯示：50，隱藏：4000}，

$(function() { 
    $("#popover-a").popover({ 
    html: true, trigger: 'click hover', delay: {show: 50, hide: 4000}, 
    content: function(){ 
     return $('#popover-content-a').html();  
    } 
    }); 
    $("#popover-b").popover({ 
    html: true, trigger: 'click hover', delay: {show: 50, hide: 4000}, 
    content: function(){ 
     return $('#popover-content-b').html();  
    } 
    }); 
})

來源

2016-10-25 23:35:43 Bob

Bootstrap彈出窗口需要一些功能

回答

相關問題