Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to hide tippy js tooltip after some seconds onclick?

Tags:

tippyjs

Is there any default method to hide tooltip after a few seconds on click? I want to show it on click for 2 sec and then close it. how should i do this?

like image 642
user2177459 Avatar asked Nov 07 '25 18:11

user2177459


1 Answers

You need to set a timeout when the tooltip is first shown. I also like to add hideOnClick: false so that it doesn't disappear when they click somewhere else.

Here's a complete example for you:

tippy('#button', {
  trigger: 'click',
  hideOnClick: false,
  onShow(instance) {
    setTimeout(() => {
      instance.hide();
    }, 2000);
  }
});
like image 165
NuclearApe Avatar answered Nov 09 '25 07:11

NuclearApe



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!