Как отобразить всплывающую подсказку при вводе мыши и скрыть ее при помощи Tippy.js

Я использую Tippy.js. Я хотел бы показать всплывающую подсказку на указателе мыши, но скрыть ее при нажатии.

Это вызывает всплывающую подсказку, когда вы нажимаете на элемент с .tippy и остается открытым, пока вы не нажмете.

tippy('.tippy', { trigger: 'click' });

Это показывает всплывающую подсказку при наведении мыши на элемент с .tippy и прячется, когда мышь покидает .tippy элемент.

tippy('.tippy', { trigger: 'mouseenter' });

Я хочу сочетание обоих. Покажите подсказку на указателе мыши, но оставьте ее открытой, пока я не щелкну.

Я предпочитаю ** не прослушивать события щелчка и события мыши и вводить их вручную и скрывать при использовании { trigger: 'manual' }

Кроме того, не могли бы вы объяснить {custom} опция запуска. Из документации:

{custom} относится к тому факту, что вы можете иметь любого прослушивателя событий, но у него не будет противоположного события "скрыть".

Могу ли я использовать {custom} триггер для того, что я ищу? Как?

Большое спасибо!

1 ответ

Начиная с версии 3 вы можете использовать set() метод.

tippy('.tippy', {
  trigger: 'mouseenter',
  onShow(tip) {
    tip.set({ trigger: 'click' })
  },
  onHide(tip) {
    tip.set({ trigger: 'mouseenter' })
  }
})
Другие вопросы по тегам