boostrapのポップオーバーを、クリックではなくホバーで表示する
triggerを「hober」にしても、ポップオーバーにカーソルを当てようとすると消えてしまうため、例えばそのポップオーバーにボタンを入れたいというときは使えない。
そこでtriggerは「manual」にして、地道にやるしかなかった。
function enableThumbPopover() { var counter; $('.thumbcontainer').popover({ trigger: 'manual', animation: false, html: true, title: function () { return $(this).parent().find('.thumbPopover > .title').html(); }, content: function () { return $(this).parent().find('.thumbPopover > .body').html(); }, container: 'body', placement: 'auto' }).on("mouseenter",function () { var _this = this; // thumbcontainer console.log('thumbcontainer mouseenter') // clear the counter clearTimeout(counter); // Close all other Popovers $('.thumbcontainer').not(_this).popover('hide'); // start new timeout to show popover counter = setTimeout(function(){ if($(_this).is(':hover')) { $(_this).popover("show"); } $(".popover").on("mouseleave", function () { $('.thumbcontainer').popover('hide'); }); }, 400); }).on("mouseleave", function () { var _this = this; setTimeout(function () { if (!$(".popover:hover").length) { if(!$(_this).is(':hover')) // change $(this) to $(_this) { $(_this).popover('hide'); } } }, 200); }); }