Topic: Tooltips can get broken
Expected behavior
Tooltips should show every time i hover over the element they are added to and hide on unhover.
Actual behavior
Tooltips sometimes stop showing up on hover, especially when frequently hovering and unhovering, but also during normal usage. On Firefox, they also sometimes stop hiding and stay.
Resources (screenshots, code snippets etc.)
The tooltip demo page has the same bug:
https://mdbootstrap.com/docs/standard/components/tooltips/
Grzegorz Bujański staff answered 4 years ago
Qw4rtz answered 4 years ago
This exact same bug also happens with popovers (for both click and hover triggers).
Also they (tooltips and popovers) sometimes seem to "lose" their parents (they teleport to the top left corner, sometimes in the center but I guess the location where they teleport to depends on my styles).
Grzegorz Bujański staff answered 4 years ago
chofmann pro premium answered 4 years ago
Another thing i noticed. In the tooltip doc it says:
Tooltips are opt-in for performance reasons, so you must initialize them yourself.
When i remove the following code:
const tooltips = document.querySelectorAll('[data-mdb-toggle="tooltip"]');
tooltips.forEach(tooltip => new mdb.Tooltip(tooltip, {
boundary: 'window'
}));
but leave all the data-mdb-toggle="tooltip"
in, they are still getting initialized. Is this supposed to happen like this?
Grzegorz Bujański staff answered 4 years ago
softcon pro premium answered 4 years ago
I have the same issue on the latest version. I added it to the support forum but realised it is a duplicate of this issue, so I've closed mine and will add it to this instead (below):
*Expected behavior*Roll mouse over tooltip, tooltip displays in default place next to link, or top, bottom, left, right where specified
*Actual behavior*Tooltip displays for half a second and then pops to the top left of the screen.. Sometimes it doen't display at all. Sometimes it displays in the top middle of the screen.
*Resources (screenshots, code snippets etc.)*Error can be seen on demo site https://mdbootstrap.com/docs/standard/components/tooltips/#docsTabsOverview - roll over "Hover the link to see the tooltip" link a few times. Try scrolling up/down the page a bit and then scroll over it again. Notice the tooltip displays at the top.Screenshot available here: https://ufile.io/r2mes2fl
Also can happen on popover
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: 3.2.0
- Device: PC
- Browser: Chrome/Firefox
- OS: Windows 10
- Provided sample code: No
- Provided link: Yes