角度ブートストラップツールチップにトリガー

Question

私は角ブートストラップを使用して、私のツールチップを持つようにしたいんだが、デスクトップ上の「ホバー」を使用してトリガしていることができ、モバイルデバイス上で「クリック」ツールチップの外側をクリックするとツールチップが閉じることがあります。私は「outsideClickは」しかし、これは完全にそうでもホバーは動作しないツールチップを壊し、今サポートトリガー（https://github.com/angular-ui/bootstrap/tree/master/src/tooltip/docs）であるため、=「outsideClickを置く」ツールチップ・トリガに設定します。

<span class="glyphicon glyphicon-info-sign" tooltip-trigger="hover outsideClick" uib-tooltip="Tooltip text here"></span> 

これらの作業をまとめる方法はありますか？

私はちょうどツールチップ・トリガを使用する場合は=それはまともだが、携帯電話で私はそれを閉じるためにページ上の他の場所をクリックすることができるという対、再びアイテムをクリックすると、ツールチップを閉じることができ「をクリックしてくださいホバー」。

Answer 1

tooltip-trigger="mouseenter outsideClick"を試しましたか？ hoverはドキュメントに記載されていないようです。

Answer 2

ネイティブブートストラップライブラリを使用する可能性がある場合は、あなたが探しているものをデフォルトでサポートしています。

私が作成したjsfiddle実証し、この

HTML（期待通りに働いてtootlips見るためにあなたのモバイルデバイスで表示してください）：

<div class="row"> 
    <div class="col-md-12"> 
    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button> 
    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button> 
    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button> 
    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button> 
    </div> 
</div> 

JS：

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

あなたをそれを読むことができるhere、サイドノートとして、あなたは手動でツールチップを有効にする必要があります

パフォーマンス上の理由から

、ツールチップとポップオーバーデータAPIは、オプトインしている、あなたがそれらを自分で初期化しなければならないという意味。ページ上のすべてのツールチップを初期化する

一つの方法は、彼らのdata-toggle属性によってそれらを選択するために、次のようになります。

Answer 3

私は、あなたが探していることはtooltip-trigger="hover focus"だと思い、focusは、outsideClickとして動作します次のクリック時にツールチップを閉じます。私はこれを個人的に使っており、モバイルとデスクトップの両方で素晴らしい作品です。

それは実際にhover focusデフォルトはそうあなたも手動で追加する必要はありません。