aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Tooltip/tooltip.ts
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib/Tooltip/tooltip.ts')
-rw-r--r--src/lib/Tooltip/tooltip.ts10
1 files changed, 6 insertions, 4 deletions
diff --git a/src/lib/Tooltip/tooltip.ts b/src/lib/Tooltip/tooltip.ts
index 5772c33f..3235cb25 100644
--- a/src/lib/Tooltip/tooltip.ts
+++ b/src/lib/Tooltip/tooltip.ts
@@ -14,12 +14,13 @@ const tooltip = (element: HTMLElement) => {
tooltipDiv = document.createElement("div");
tooltipDiv.style.position = "absolute";
+ tooltipDiv.style.top = "-9999px";
+ tooltipDiv.style.left = "-9999px";
tooltipDiv.style.zIndex = "1000";
tooltipDiv.style.opacity = "0";
- tooltipDiv.style.transition = `opacity ${tooltipTransitionTime}ms ease-in-out, top 0.3s ease, left 0.3s ease`;
+ tooltipDiv.style.transition = `opacity ${tooltipTransitionTime}ms ease-in-out`;
tooltipDiv.style.pointerEvents = "none";
tooltipDiv.style.whiteSpace = "nowrap";
- tooltipDiv.style.zIndex = "1000";
tooltipDiv.classList.add("card");
tooltipDiv.classList.add("card-small");
@@ -81,11 +82,12 @@ const tooltip = (element: HTMLElement) => {
tooltipDiv.innerHTML = content.replace(/\n/g, "<br>");
updateTooltipPosition(x, y);
- setTimeout(() => {
+ requestAnimationFrame(() => {
if (tooltipDiv) {
+ tooltipDiv.style.transition = `opacity ${tooltipTransitionTime}ms ease-in-out, top 0.3s ease, left 0.3s ease`;
tooltipDiv.style.opacity = "1";
}
- }, 10);
+ });
}
};