2015-01-06 3 views
0

Я пытаюсь создать внешний вид при наведении курсора на кнопку.AngularStrap hover popover

Пример кода:

<button data-content="some data with links" data-auto-close="1" data-placement="bottom" bs-popover html='true' data-trigger="hover">Popover</button> 

поповер действительно появляется, когда я парить кнопку. Но проблема в том, что когда мышь перемещается к popover, она исчезает. Как я могу заставить popover оставаться, когда я перехожу к нему? Как я могу скрывать скрытие, когда я нажимаю ссылку на контент?

ответ

0

Для точного же предмета есть fiddle demo. Надеюсь, поможет.

HTML:

<p id='container'> 
<button class='btn btn-primary btn-large' data-popover="true" data-html=true data-content="<a href='http://www.wojt.eu' target='blank' >click me, I'll try not to disappear</a>">hover here</button> 
</p> 

JS:

var originalLeave = $.fn.popover.Constructor.prototype.leave; 
$.fn.popover.Constructor.prototype.leave = function(obj){ 
    var self = obj instanceof this.constructor ? 
    obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type) 
    var container, timeout; 

    originalLeave.call(this, obj); 

    if(obj.currentTarget) { 
    container = $(obj.currentTarget).siblings('.popover') 
    timeout = self.timeout; 
    container.one('mouseenter', function(){ 
     //We entered the actual popover – call off the dogs 
     clearTimeout(timeout); 
     //Let's monitor popover content instead 
     container.one('mouseleave', function(){ 
     $.fn.popover.Constructor.prototype.leave.call(self, self); 
     }); 
    }) 
    } 
}; 


$('body').popover({ selector: '[data-popover]', trigger: 'click hover', placement: 'auto', delay: {show: 50, hide: 400}}); 
+0

Вопрос для AngularStrap. Не бутстрап. – djxak

Смежные вопросы