2

这个 jsfiddle说得最好，但我有一个可以正常工作的弹出框触发器。然而，如果我把容器贴上去，弹出框就会被压扁。为什么以及如何解决这个问题？

<script type="text/javascript">
$(function () {
    $(".popover-trigger").popover({
        content: function () {
            return $("#popover-content").html();
        }
    });

    $(".btn").click(function(){
        var jq = $(".popover-trigger").parent().toggleClass("affix");
        var state = jq.hasClass("affix") ? "" : "not";
        $(".state").html(state);
    });
});
</script>
<div id="popover-content" class="hide">Lorem ipsum dolor sit amet ... </div>
<div class="container">
    <div class="row">
        <div class="well">
            <div class="popover-trigger" data-trigger="hover" data-toggle="popover" data-original-title="Popover" data-html="true">
                I'm <span class="state">not</span> affixed. 
                <button class="btn">Toggle</button>
            </div>
        </div>
    </div>
</div>
4

2 回答 2

4

不知道为什么，但设置弹出框的container选项解决了我的问题，如this fiddle所示。

于 2013-07-29T18:42:15.300 回答
1

查看更新的小提琴

我不是专家，但在 CSS 中定义弹出框的大小有助于确保它保持其形状。这是通过调用来完成的popover {height: x; width: y}。

于 2013-07-29T17:55:41.480 回答