Topic: tooltip delay
Dear Support Team,
I would like to ask, is it possible to specify delay on tooltip before show the text?
Thank you, Mihaly
lyahim answered 4 years ago
I found an alternative way to simulate delay. I made a wrapper div what have a mouseover event listener. The function handle the timeout. Other important part is the tooltipClass on mdb-tooltip what hide the whole tooltip part of the component initially. Here have to use visibility attribute instead of display.
<div @mouseover="mouseOver">
<mdb-tooltip sm trigger="hover" :class="tooltipClass">
</mdb-tooltip>
data() {
return {
timer: null,
tooltipClass: "btn-tooltip"
}; },
methods: {
mouseOver() {
if (this.timer) {
clearTimeout(this.timer);
this.timer = null;
this.tooltipClass = "btn-tooltip";
}
this.timer = setTimeout(() => {
this.tooltipClass = "";
}, 1000);
}
}
.btn-tooltip /deep/ .tooltip { visibility: hidden;}
Mikołaj Smoleński staff commented 4 years ago
Thank you for sending your solution. It can be very useful for our other users.
Best regards
lyahim commented 4 years ago
Dear Mikolaj!
Is it possible to create a new change request to add this feature?
Thank you, Mihaly
Magdalena Dembna staff premium commented 4 years ago
I will add this to our feature request list. Best regards, Magdalena
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Open
- User: Free
- Premium support: No
- Technology: MDB Vue
- MDB Version: 6.7.1
- Device: All
- Browser: All
- OS: All
- Provided sample code: No
- Provided link: No
Mikołaj Smoleński staff commented 4 years ago
Unfortunately there is no such option. Best regards
lyahim commented 4 years ago
Dear Mikolaj!
Is it possible to create a new change request to add this feature?
Thank you, Mihaly