私は、Twitter Bootstrap ポップオーバー バージョン 1.3.0情報を表示します。この情報にはリンクが含まれていますが、リンクからポップオーバーにマウスを移動するたびに、ポップオーバーが消えてしまいます。
マウスがポップオーバー内に入るまでポップオーバーを開いたままにするにはどうすればよいでしょうか? その後、マウスがリンクとポップオーバーから外れたら、ポップオーバーを非表示にできますか?
それとも、これを実行できる他のプラグインはありますか?
ベストアンサー1
ブートストラップ (バージョン 2 でテスト済み) を使用すると、次のコードがわかりました。
$("a[rel=popover]")
.popover({
offset: 10,
trigger: 'manual',
animate: false,
html: true,
placement: 'left',
template: '<div class="popover" onmouseover="$(this).mouseleave(function() {$(this).hide(); });"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'
}).click(function(e) {
e.preventDefault() ;
}).mouseenter(function(e) {
$(this).popover('show');
});
主なポイントは、テンプレートを mouseleave() イネーブラーでオーバーライドすることです。これが役立つことを願っています。