1. ホーム
  2. javascript

[解決済み] Bootstrapのポップオーバーをクリックではなくホバーで表示/非表示にする

2022-04-18 08:32:08

質問

Bootstrapの ポップオーバー で、クリックではなくホバーでポップオーバーが表示されるようにする方法がわからないのです。

私がしたいのは、誰かがリンクをクリックする代わりに、その上にマウスを置いたときにポップオーバーが表示され、その人が離れるとポップオーバーが消えるようにすることです。ドキュメントには、data属性かjqueryのどちらかを使って可能だと書いてあります。複数のポップオーバーがあるので、jqueryでやりたいと思います。

解決方法は?

を設定します。 trigger オプションに hover ではなく click である。 デフォルト の1つです。

これは、以下のどちらかを使用して行うことができます。 data-* 属性をマークアップしています。

<a id="popover" data-trigger="hover">Popover</a>

または初期化オプション付き。

$("#popover").popover({ trigger: "hover" });

ここでは DEMO .