Question

Here is my implementation of loading the content for popover through ajax.
It loads the content and even shows the popover.
My problem is that on the very first”show”, after ajax load, it shows and hides immediately. After that it works fine.

  $("a.mypopover").bind("hover", function() {
    var el=$(this);
    el.unbind("hover");
    $.ajax({
      url: el.attr('href'),
      success: function(d){
        el.popover({ content: "dynamic text", placement:'bottom' })
          .click(function(e) {
            e.preventDefault() ;
          })
          .bind("mouseleave", function(e) {
            $(this).popover("hide");
          });
        el.popover("show");
      }
    });
    return false;
  });

Answer 1

$("a.mypopover").bind("hover", function() {
var el=$(this);
el.unbind("hover");
$.ajax({
  url: el.attr('href'),
  success: function(d){
    el.popover({ content: "dynamic text", placement:'bottom', html:true, trigger:'hover' }).popover("show");
  }
});
return false;
});

Just use ‘trigger’ to hover.