5

ブートストラップポップオーバーをWebサイトで機能させようとしていますが、ある程度成功しています。リンクをクリックするとポップオーバーが表示されますが、タイトル以外のコンテンツがボックスに表示されません。私はそれを2つの方法で試しました：

<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/newSign 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();    
});

その後、それは動作します。しかし、なぜポップオーバー設定を2回（スクリプトとデータ属性の両方で）定義するのですか？

ユーレカ！

bootstrap.cssのデフォルトのスタイルを変更したようです。ポップオーバーの内容は実際にはに表示され<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 に答える