ブートストラップポップオーバー - 2回目のクリックまで間違った位置に表示される画像

Question

私のページには、クリックするとブートストラップポップオーバーの中にコンテンツが表示されるはずのボタンが多数あります。コンテンツは私のデータベースからロードされ、サイズやサイズが異なる可能性のあるテキストや画像になる可能性があります。私はIEで正しく動作するソリューションを実装していますが、ChromeとFirefoxでは最初にクリックするとポップオーバーが途中で開きますボタン。同じボタンを2回クリックすると、IEのように問題なく画像が正しい位置に表示されます。ポップオーバーの内容がテキストの場合、すべてのブラウザで正しく表示されますが、ChromeとFirefoxでは画像に問題が表示されます。私はこれを研究しましたが、すべてのブラウザで動作するのに役立つものは見つかりませんでした。どんな助けも素晴らしいだろう。同じISSUに遭遇する可能性があり、誰のために

HTML

<button type="button" class="btn btn-default btn-xs" data-toggle="popover" data-container="body" data-content="@item.Content">@item.Title</button> 

JS

$(document).ready(function() { 
      $('[data-toggle="popover"]').popover({ 
       html: "true", 
       placement: "top", 
      }); 
    }); 

CSS

popover{ 
width:auto!important; 
max-width: none; 
} 

Answer 1

私はこれを見つけました。スクリプトに 'hover'という行を追加すると、各ブラウザの正しい位置に画像が読み込まれるようになりました。