Bootstrap popover funktioniert nicht in Chrome

Question

http://www.rightoption.co/

Sie „Unser Kunde“ Auf RHS Seite der Seite an, auf der Bilder klicken, es öffnet popover (Firefox), Aber es funktioniert nicht in Google Chrome, Bitte helfen Sie mir aus dieser

bearbeiten: Website ist nicht mehr auf Hosting

Answer 1

Dies liegt daran, dass die Standard-Trigger für die popover Fokus ist. Wenn Sie in Firefox auf etwas klicken, scheint es den Fokus zu gewinnen, aber das scheint in diesem Fall nicht für Chrome zu gelten.

Sie können eine von zwei Dinge versuchen:

Versuchen Sie, den Auslöser auf dem Tag zu sein „manuell“ manuell einstellen. So fügen Sie diese Attributdaten-Trigger = "manuell"

OR

in Ihrem Dokument onload, anstatt das zu tun:

$('#element, #element1').popover('toggle').popover('hide'); 

Verwendung dieser Linie statt:

$('#element, #element1') 
    .popover() 
    .click(function(e) { 
     e.preventDefault(); 
     $(this).focus(); 
    }); 

Answer 2

Die akzeptierte Antwort ist ziemlich veraltet, aber es kam für mich in einer Google-Suche, so möchte ich hinzufügen, dass ab Version 2.3.0 Bootstrap nun erlaubt, "Hoverfokus" als Auslöser zu senden, damit es auf beiden funktioniert. Und ganz wichtig, es ermöglicht auch einen Klick-Auslöser, der wie erwartet funktioniert (speziell für Chrome).

Answer 3

Das funktionierte für mich!

var el = $('[data-toggle="popover"]'); 
el 
    .on('shown.bs.popover', function(){ 
     $(document).on('click.popover', function() { 
      el.popover('hide'); 
      $(document).off('click.popover'); 
     });        
    }) 
    .popover(); 

aktualisieren: Die oben hatte ein Problem, wobei ein anderes popover Element klicken, während ein popover angezeigt wird, um die offene popover schließt aber nicht öffnet die neue. Das Folgende schließt das offene Popover und öffnet das neue mit einem Klick.

var el = $('[data-toggle="popover"]'); 
el 
    .on('click', function(e){ 
     var el = $(this); 
     setTimeout(function(){ 
      el.popover('show'); 
     }, 200); // Must occur after document click event below. 
    }) 
    .on('shown.bs.popover', function(){ 
     $(document).on('click.popover', function() { 
      el.popover('hide'); // Hides all 
     }); 
    }) 
    .on('hide.bs.popover', function(){ 
     $(document).off('click.popover'); 
    });