ブートストラップポップアッププラグインは、拡張ビューを提供します。ポップアッププラグインは、要件に応じてコンテンツとタグを生成します。デフォルトでは、ポップアップはトリガー要素の後ろに配置されます。
ポップオーバーはツールチップに似ており、拡張ビューを提供します。ポップアップボックスをアクティブにするには、ユーザーは要素の上にホバリングする必要があります。ポップアップボックスの内容は、Bootstrap Data API（Bootstrap Data API）を使用して完全に入力できます。この方法はツールチップに依存しています。
プラグインの機能を個別に参照する場合は、ツールチッププラグインに依存するpopover.jsを参照する必要があります。または、bootstrapプラグインの概要章で述べたように、bootstrap.jsまたはbootstrap.min.jsの圧縮バージョンを参照できます。
1。使用法
ポップオーバープラグインは、ニーズに基づいてコンテンツとタグを生成します。デフォルトでは、ポップオーバーはトリガー要素の後ろに配置されます。 2つの方法でポップオーバーを追加できます。
データプロパティを渡す：ポップオーバーを追加するには、Anchor/ButtonラベルにData-Toggle = "Popover"を追加するだけです。アンカーのタイトルは、ポップオーバーのテキストです。デフォルトでは、プラグインは上部にポップオーバーを設定します。
<a href = "＃" data-toggle = "popover">私の</a>を越えてください
JavaScriptを介して：JavaScript経由でポップオーバーを有効にします：
$（ '＃識別子'）。ポップオーバー（オプション）
ポップオーバープラグインは、前述のドロップダウンメニューやその他のプラグインのようなものではなく、純粋なCSSプラグインではありません。プラグインを使用するには、jQuery（javascriptを読む）を使用してアクティブ化する必要があります。次のスクリプトを使用して、ページ内のすべてのポップオーバーを有効にします。
$（function（）{$（ "[data-toggle = 'popover']"）。popover（）;}）;
2。例
ポップアップボックスは、要素をクリックして、タイトルとコンテンツを含むコンテナをポップアップすることです。
// basic usage <button type = "button" data-toggle = "popover" data-content = "これはポップアップボックスプラグインです"> [ポップアップボックス]をクリックしてポップアップボックス</button> // javascript initialize $（ 'button'）。
ポップアッププラグインには、次のようにプロンプトの表示を構成するための多くのプロパティがあります。
$（ 'button'）。ポップオーバー（{container： 'body'、viewport：{selector： '#view'、padding：10、}}）;JavaScriptを介して実行する4つの方法があります。
// show $（ 'button'）。ポップオーバー（ 'show'）; // $（ 'button'）。ポップオーバー（ 'hide'）; // show and hide $（ 'button'）。
ポップオーバープラグインには4種類のイベントがあります。
//イベント、その他$（ 'button'）。
上記はこの記事に関するすべてです。誰もがブートストラップポップアッププラグインを学ぶことが役立つことを願っています。