引导弹出框/点击答案

【问题标题】：Bootstrap Popover / Clickover引导弹出框/点击
【发布时间】：2013-01-07 10:17:10
【问题描述】：

所以我想知道...我正在为我的项目使用 Twitter 的 Bootstrap，并且我做了一个小通知 Popover / Clickover (http://www.leecarmichael.com/bootstrapx-clickover/examples.html) 功能。我想知道我怎么能设法让它在一个静态高度上，里面有一个自定义滚动条......

我创建此弹出框/点击框的基本概念是：

$(function () {
    $("[rel='tooltip']").tooltip({container: 'body'});
});
$("#notices").clickover({
    content:data,
    html:true,
    container:'body'
    ,onShown: function () {$("#notices").tooltip("destroy");},
    onHidden: function () {$("#notices").tooltip({container:'.navbar'});},
    template: '\
        <div class="popover notices">\
            <div class="arrow"></div>\
            <div class="popover-inner">\
                <div class="popover-header">\
                    <h3 class="popover-title"></h3>\
                    <h3 class="popover-settings"><a href="/notifications.php?act=settings">Settings</a></h3>\
                </div>\
                <div class="popover-content">\
                    <p></p>\
                </div>\
                <h3 class="popover-footer"><center><a href="/notifications.php">See All</a></center></h3>\
            </div>\
        </div>'

});

使用 HTML

<div id='userbar' class='btn-group input-prepend input-append'>
    <button class='btn'></button>
    <button class='btn'></button>
    <button class='btn'></button>
    <button class='btn'></button>
    <button class='btn'></button>
    <button class='btn'></button>
    <button class='btn'></button>
    <button id='notices' class='btn' rel='tooltip' data-placement='bottom' data-original-title='Notifications'> <i class='icon-exclamation-sign icon-large'> <span class='badge badge-important'>102</span></i></button>
</div>

所以我在 JSFiddle 上发了一篇关于这个的帖子。我没有包含来自 bootstrap 站点的 bootstrap 指令，但我已经在 Javascript 部分中发布了代码，因为工具提示有点修改。所以可能有很多代码行，虽然我的主要代码在最后......

链接是：http://jsfiddle.net/6GRHa/3/

带有弹出框的按钮是“感叹号”

就像我说的那样，我想为它应用一个自定义高度和一个可滚动条以显示更多内容......提前谢谢你......

【问题讨论】：

标签： javascript twitter-bootstrap popover jsfiddle

【解决方案1】：

只需添加一些 css 即可为弹出框提供固定高度和滚动条：

.popover-inner {
   height: 250px;
   overflow:scroll;
}

小提琴在这里： http://jsfiddle.net/6GRHa/4/

【讨论】：

谢谢 :) 非常辛苦

【解决方案2】：

.popover-content {
    max-height: 300px;
    overflow-y: auto;
}

【讨论】：

谢谢 :) 非常辛苦