5

我试图让引导弹出窗口在网站上工作,我已经取得了一些成功。单击链接时,我可以显示弹出框,但是除了标题之外,我在框中看不到任何内容。我已经尝试了两种方法:

<a class="btn btn-link login-popover" rel="popover" data-placement="bottom" data-title="Sign in to the website builder" data-html="true" data-content="Lo4545445"> Sign in  <span class="caret"></span></a>

$('.login-popover').popover({
    placement: 'bottom',
    title: 'Sign in to the website builder',
    content: 'testing 123',
    trigger: 'click'
});

然而,没有人真正显示框中的内容。您可以通过访问http://www.onemobi.net/new并单击Sign in顶部来了解我的意思。

编辑:我不会同时做这两件事。我试过一个,然后另一个。

4

2 回答 2

8

您必须将代码放在函数中

$(document).ready(function() {
  $('.login-popover').popover({
    placement: 'bottom',
    title: 'Sign in to the website builder',
    content: 'testing 123',
    trigger: 'click'
  });
});

或者

$(function () { 
   $(".login-popover").popover();    
});

然后它工作。但是为什么要定义两次弹出设置(在脚本和数据属性中)?

尤里卡!

您似乎更改了 bootstrap.css 中的默认样式。弹出框的内容实际上显示在 a 中<p>,但是您有

.btn-group {
  font-size: 0;
  white-space: nowrap;
}

很明显,通过改变 font-size: 0; 内容将可见(在 chrome 检查器中测试)添加到您的 CSS

.btn-group {
  font-size: 12px; /*or whatever size */
}
于 2012-11-08T09:11:37.240 回答
0

当我检查当前版本(v2.2.2)时,这个错误已经解决。请下载最新的。

于 2013-01-03T01:06:44.397 回答