使用Bootstrap彈出/提示堆疊進度條

我無法弄清楚如何讓Bootstrap堆疊進度條的每個部分顯示彈出窗口或工具提示，最好是前者;但是，工具提示也可以。使用Bootstrap彈出/提示堆疊進度條

外<div class="progress"></div>我可以做一個<div>，將顯示一個酥料餅或工具提示是這樣的：

<div class="mypopover" title="" data-content="content here" data-placement="bottom" data-toggle="popover" data-original-title="title here">click to see popover</div> 

<script type="text/javascript"> 
    $('.mypopover').popover(); 
</script>

＆hellip;但是，這並不工作：

<div class="progress"> 
    <div class="bar bar-success mypopover" style="width:50%;" title="" data-content="victory" data-placement="bottom" data-toggle="popover" data-original-title="successful">SUCCESS!</div> 
    <div class="bar bar-danger mypopover" style="width:50%;" title="" data-content="so sad" data-placement="bottom" data-toggle="popover" data-original-title="unsuccessful">failure</div> 
</div> 

<script type="text/javascript"> 
    $('.mypopover').popover(); 
</script>

你如何獲得彈出式窗口（或工具提示）可用於堆疊進度條的各個部分？謝謝你的幫助！

來源

2013-08-20 Kabb5

似乎要被罰款這裏工作：

fiddle（引導3）

fiddle（引導2.3）

HTML：

<div class="progress"> 
    <div class="progress-bar progress-bar-success mypopover" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" title="" data-content="content here" data-placement="bottom" data-toggle="popover" data-original-title="title here" style="width: 40%"> 
    </div> 
</div> 
<div class="progress"> 
    <div class="progress-bar progress-bar-info mypopover" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" title="" data-content="content here" data-placement="bottom" data-toggle="popover" data-original-title="title here" style="width: 20%"> 
    </div> 
</div>

來源

2013-08-20 17:59:57 Yogesh

是的，你說得對...一旦我清除我的瀏覽器緩存它爲我工作 - 多麼討厭。 – Kabb5

如果您使用的是Chrome，那麼您可以在開發工具處於打開狀態時設置禁用緩存選項，然後在窗口的右下角點擊它，然後選中第一個複選框。（禁用緩存）。如果您使用的是IE開放式開發工具F12，並在主菜單欄中選擇緩存並選擇始終從服務器刷新。但是，在IE的情況下，每次打開瀏覽器時都必須設置此選項。 – Yogesh

使用Bootstrap彈出/提示堆疊進度條

回答

相關問題