Interactivity

Tooltips can be interactive, meaning you can hover over or click on them and they won't hide.

Option	Default	Inputs	Role
interactive	false	Boolean	Makes a tooltip interactive, i.e. will not close when the user hovers over or clicks on the tooltip. This lets you create a popover (similar to Bootstrap) when used in conjunction with a click trigger.
interactiveBorder	2	Number (pixels)	Specifies the size of the invisible border around an interactive tooltip that will prevent it from closing. Only applies to mouseenter triggered tooltips.

<button title="I don't close when the cursor moves onto me!"
        v-tippy='{ interactive : true }'>
    Interactive with hover
</button>

1
2
3
4

<button title="Feel free to interact with me." 
        v-tippy='{ interactive : true, trigger: "click" }'>
    Interactive with click
</button>

1
2
3
4

# Interactivity