我想要一个popover包含在一个可折叠的div:
http://jsfiddle.net/nathan9/qgyS7/中.但是,popover似乎仅限于div的范围.有没有办法防止剪辑?
<a href="#toggle" data-toggle="collapse" data-target="#toggle" onClick="return false;">Toggle collapse</a> <div id="toggle" class="collapse" style="background-color: yellow"> Content of collapsible div. Click for popover: <i class="icon-info-sign" id="info"></i> </div>
…
<script> $('#info').popover({ html: true,placement: 'left',title: 'Popover',content: "<ul><li>The</li><li>popover</li><li>is</li><li>clipped.</li></ul>" }); </script>
解决方法
使用计时器始终是一项有风险的业务.我使用了Mike Lucid的一个变种,它可以收听可折叠事件,显示和隐藏.
代码如下:
$(document).ready(function(){ $('#toggle') .on('shown',function(evnt) { $(evnt.target).addClass('visible'); }) .on('hide',function(evnt) { $(evnt.target).removeClass('visible'); }) ; });
如果您希望可折叠在加载时可见,请不要忘记在可折叠div中添加类和可见.
编辑
从Bootstrap 2.3开始,工具提示和弹出框有一个新的容器选项.如果将容器设置为“body”,则不会剪切工具提示和弹出窗口. Here is a working fiddle.
希望有所帮助.