0

I'm using ngx-bootstrap in a Angular8 project. and I need to implementation a feature like this:

mouseover a button , a tooltip will show, and if I keep the mouse on the content of the tooltip, it will keep shown , and once my mouse leave the content of the tooltip, it will disappear.

so I want to handle the event of onShown and tigger the show method manually . and then tigger hidden method when mouse leave the content of tooltip. I have no idea to know how to decide if the mouse is leaved the content of the tooltip. but first I need to handle the event here:https://valor-software.com/ngx-bootstrap/#/tooltip#triggers-custom . theOutputs it saysEmits an event when the tooltip is hidden. I want to know how to handle it.

thank you .

jjzjx118_2
  • 419
  • 7
  • 23
  • Hi! Do I understand it right that the `show` and the `hide` triggered on the same content area? – Lucho Jul 30 '19 at 09:01
  • no , show triggered on the button , and hide when mouseleave the content of the tooltip – jjzjx118_2 Jul 30 '19 at 09:36
  • Ah I see, since ngx-bootstrap doesnt have a direct api for handling the dynamic tooltip you have to ugly code sligthly with vanillaJS [querySelector](https://stackoverflow.com/questions/44010729/adding-event-listener-to-dynamic-element-in-angular-4). You think you know how or do you want an example? – Lucho Jul 31 '19 at 09:35
  • yes, it could be helpful if you can provid a example. and I found a sample code here which exactly what I want :https://embed.plnkr.co/plunk/K6WPaM . but it use jquery. and I want to use it in Angular8. – jjzjx118_2 Aug 02 '19 at 05:44

0 Answers0