Предотвратить показ всплывающей подсказки по popover

Question

Мне нужен < a> тег, который отображает всплывающую подсказку курсора на перемещение курсора и должен бросать popover при нажатии. Но всплывающая подсказка также отображается, когда я перемещаю курсор над popover. Проверьте это: https://jsfiddle.net/ivictbor/re15cuby/2/.

Html:

<span data-toggle="tooltip" data-placement="bottom" title="sometext"> 
    <a id="my_uniq_id" href="javascript:void(0);" >   
     link</a> 
    </span> 

JS:

$("#my_uniq_id").on("click", function drop_popover() { 
id = 'my_uniq_id' 
var el = $("#"+id); 
$("body").append(
     '<div id="' +id+'_hldr'+'" style="display: none;">'+ 
      'popover holder code'+ 
     '</div>' 
); 
el.popover({ 
     placement : 'bottom', 
     html : true, 
     trigger: 'manual', 
     title: ': <a href="#" style="float:right;"><span class="glyphicon glyphicon-remove-circle" '+ 
     'onclick="$(\'#'+id+'\').popover(\'hide\');"></span></a>', 
     content: function() { 
      return $('#'+id+'_hldr').html(); 
     }, 
    }).click(function(e) { 
     e.preventDefault(); 
    }); 
    el.popover('show'); 
}) 

$(function() { 
    $('[data-toggle="tooltip"]').tooltip({html: true}) 
}) 

Answer 1

нужно добавить 'контейнер: 'тело'' в настройках поповер:

el.popover({ 
    placement : 'bottom', 
    container: 'body', 
    html : true, 

Благодаря cvrebert

Answer 2

Это должно сделать трюк:

$('[data-toggle="tooltip"]').tooltip({html: true}).on('click', function(){ 
      $(this).tooltip('hide'); 
     });