javascript - ホバーとフォーカスに関する Twitter Bootstrap ツールチップ

Question

Twitter ブートストラップ ツールチップ トリガーのデフォルトはホバーです。

data-trigger="focus" を追加して、ツールチップがフォーカス時に表示されるようにすることはできますが、ホバーとフォーカスの両方を行うにはどうすればよいですか?

Answer 1

やってみましたdata-trigger="focus hover"

Answer 2

@Adrian によるソリューションは、Bootstrap 3 では機能しません。以下を使用します。

$('[rel=tooltip]').tooltip();
$(document).on('hover', '[rel=tooltip]', function () { $(this).tooltip('show'); });
$(document).on('focus', '[rel=tooltip]', function () { $(this).tooltip('show'); });

Answer 3

triggerは単一値のプロパティであるため、両方のメソッドのいずれかを偽造する必要があります。

$('.tooltip').tooltip({trigger: 'hover'}).each(function () {
  var $this = $(this), data = $this.data('tooltip');
  $this.on('focus.tooltip', $.proxy(data.enter, data))
    .on('blur.tooltip', $.proxy(data.leave, data));
});

更新: または、私のパッチを Twitter Bootstrap に使用してtrigger、複数値のプロパティを作成し、それを に設定することもできhover focusます。