A highly customizable vanilla JS tooltip/popover library powered by Popper.js.
For reference: https://atomiks.github.io/tippyjs/
Questions tagged [tippyjs]
154 questions
2
votes
1 answer
@tippy.js/react allowHTML
In react Tippy I cannot make work some properties of tippy. I want allowHTML in Tippy.
Here is my code:
Botond Balogh
- 163
- 1
- 9
2
votes
1 answer
How to open TippyJS tooltip on click of a button elsewhere on the page?
I am trying to open a tippy tooltip when a button is clicked, not append the tooltip to this button but open it in it's own spot.
In my example I have an add to cart button and a shoppingcart icon in my menu that shows the shopping cart inside a…
twan
- 2,450
- 10
- 32
- 92
2
votes
1 answer
Fullcalendar prevent eventDidMount triggers constanty while dragging
I have a Tippy.js integrated into a FullCalendar.js calendar.
While dragging an event inside the calendar, the tooltips get crazy, losing reference to the event that triggered it.
I think the issue is that I'm creating the Tippy (tooltip) instance…
Romias
- 13,783
- 7
- 56
- 85
2
votes
0 answers
How can i show scroll on hover in tippy js?
I am using tippy.js https://atomiks.github.io/tippyjs/ for showing tooltip on hover inside my full calendar.
Now everything is fine but i am showing guest list inside it so there can be 100 or even more guest in which case the on hovering the tippy…
Divyanshu Singh
- 43
- 4
2
votes
0 answers
Use a directive or component in the content prop using Tippy.js
I am trying to figure out how to incorporate a directive or component with corresponding styling and data into the content prop of a Tippy.js object. I want to have this to give me the flexibility on working on the content and behavior as well as…
Benny
- 839
- 16
- 32
2
votes
2 answers
How to trigger click on canvas object and DOM element that is placed on top of object at the same time?
I have some circles that can be added to a fabricjs canvas. Each circle is an object, while outside my javascript code I have a DOM element, that looks like this:
twan
- 2,450
- 10
- 32
- 92
2
votes
0 answers
How to trigger tippyjs tooltip on a fabricjs object inside canvas
I am trying to create some tooltips with TippyJS on a FabricJS canvas but keep getting the error that the selectors I use are not valid.
Normally this is how I trigger a tooltip with Tippy:
$( ".hoverimagetip" ).each(function( i ) {
tippy(this,…
twan
- 2,450
- 10
- 32
- 92
2
votes
1 answer
Use tippyjs-react inside table cells
I am trying to use tippyjs-react in table cells, but tooltips don't appear.
I added tooltip into Cell option in React Table:
Cell: ({ value }) => {
return (
{value}
…
Matt
- 8,195
- 31
- 115
- 225
2
votes
0 answers
Get tiptap-vuetify to work with "Mentions" in a Vue Nuxt app
so my problem is that I can't seem to make use of the "Mentions" functionality of tiptap inside a vuetify-nuxt project.
The original example can be found here
More useful info:
Example implementation from the tiptap github here
Similar question…
toti
- 43
- 1
- 6
2
votes
2 answers
How to get rid of padding against edge of screen with Tippy.js or Popper.js
I want to create a popout menu that is flush with the edge of the screen. It seems like popper doesn't like this because it always forces a margin of 5px. I've tried setting offset and padding values to 0, but it doesn't seem to work. Is there a…
not_shitashi
- 281
- 2
- 4
- 12
2
votes
1 answer
TippyJS-React: how to open context-menu on right-click
I try to do right-click menu using tippyjs-react:
{children}
I know that I need to add the event listener with 'contextmenu' to children and use…
Nikita Ivanyushkin
- 33
- 4
2
votes
0 answers
how to make rounded arrow popover in react using tippy.js or react-popper
please help me and it is possible please put the full code of how to use tippy.js or react-popper in react to create rounded arrow custom enter image description herestyled popover like this:
and how to use the tippy.js directly in our react…
Aminullah Jalal
- 21
- 1
2
votes
1 answer
How to hide tippy js tooltip after some seconds onclick?
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?
user2177459
- 97
- 3
- 9
2
votes
1 answer
attaching angular dynamic component to tippy js content
i am using fullcalendar(v3) event render in angular with tippy js, so how can i attach angular dynamic component to tippy js content in fullcalendar(v3) event render.
const eventRender = function (event: IEvent, view) {
if (event.info)…
bangash
- 398
- 1
- 4
- 12
2
votes
0 answers
ReactJS: Display another UI element on top of codemirror editor
I have a codemirror object. I'd like to display a tippy button on top of the codemirror editory when the cursor hovers over the code.
So far I can detect when the mouse is hovering, but I can't display anything on top of the editor. My code is…
maddie
- 1,854
- 4
- 30
- 66