qtip2 - マウスがヒントの上にあるときにjquery.qtip2ツールヒントが非表示になるのを防ぐにはどうすればよいですか?

Question

ツールチップにjquery qTip2を使用します。

リンク付きのツールチップがあります。ユーザーのマウスが (トリガーではなく) ヒントに入った場合、ヒントを開いたままにしておきます。ドキュメントでそれを行う方法を理解できないようです....

Answer 1

マウスをチップの上に置いたときに表示したままにし、マウスアウトで非表示にしたい場合は、次のドキュメントで説明されている固定および遅延オプションを使用します。

$('.selector').qtip({
     content: {
          text: 'I hide on mouseout, but you can mouse into me within 500ms',
     },
     hide: {
          fixed: true,
          delay: 500
     }
});

hide パラメータには多くのオプションがあります。たとえば、無期限に非表示にしたくない場合は、単純に hide を false に設定します。

$('.selector').qtip({
    content: {
        text: 'I never hide',
    },
    hide: false
});

ヒント以外の場所をクリックするなど、別のイベントで非表示にする場合は、イベントを明示的に設定します。

$('.selector').qtip({
     content: {
          text: 'I hide when you click anywhere else on the document',
     },
     hide: {
          event: 'unfocus'
     }
});

トリガーがクリックされたときに非表示にする場合は、クリック イベントを指定します。

$('.selector').qtip({
     content: {
          text: 'I hide when you click the tooltip trigger',
     },
     hide: {
          event: 'click'
     }
});

詳細については、特に「非表示」オプションのドキュメントを参照してください。

Answer 2

ヒントを開いたままにし、ユーザーがターゲットの外側をクリックするか、ターゲットから離れたときに非表示にする場合は、次のようにします。

show: {
    event: 'mouseover'
},

hide: {
     event: 'click mouseleave'
}