Bootstrap поповер: скрыть, когда курсор перемещается за пределы окна

Question

Я хочу, чтобы отобразить поповер, который содержит несколько кнопок при наведении указателя мыши на текстовую ссылку

Проблема у меня есть Bootstrap поповер по умолчанию настоящее время я использую это уволен, когда курсор по ссылке, которая вызвала его (например, когда пользователь перемещает, чтобы выбрать один из кнопок)

---

Это jsFiddle является примером того, что я пытался сделать .. Этот принцип: показать поповер когда ссылка (#example) зависает, скрыть popover, когда popover (.popover) является unhov Ered.

Но это не сработает, хотя я уверен, что BS popover инкапсулирован в класс .popover (я проверяю инструмент FF dev debug).

Смешная вещь: она работает с другим div! Если я заменяю

$('.popover').mouseleave(function(){ 
    $('#example').popover('hide'); 
}); 

К этому

$('.square').mouseleave(function(){ 
    $('#example').popover('hide'); 
}); 

поповер не на самом деле скрывается, когда больше не парит синий квадрат.

Почему не работает с .popover?

Answer 1

Вам нужно скрыть popover, когда мышь покидает .popover-content, а не .popover. И .popover-content не существует в самом начале, так что вы должны связать событие с document

$(document).on('mouseleave','.popover-content',function(){ 
     $('#example').popover('hide'); 
    }); 

http://jsfiddle.net/o4o9rrsq/2/