diff --git a/packages/frontend/src/components/MkTooltip.vue b/packages/frontend/src/components/MkTooltip.vue
index 2a232cc2a..119c99feb 100644
--- a/packages/frontend/src/components/MkTooltip.vue
+++ b/packages/frontend/src/components/MkTooltip.vue
@@ -23,7 +23,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 </template>
 
 <script lang="ts" setup>
-import { nextTick, onMounted, onUnmounted, shallowRef } from 'vue';
+import { nextTick, onMounted, onUnmounted, shallowRef, watch } from 'vue';
 import * as os from '@/os.js';
 import { calcPopupPosition } from '@/scripts/popup-position.js';
 import { defaultStore } from '@/store.js';
@@ -70,7 +70,7 @@ function setPosition() {
 	el.value.style.top = data.top + 'px';
 }
 
-let loopHandler;
+let loopHandler: number | undefined;
 
 onMounted(() => {
 	nextTick(() => {
@@ -81,12 +81,23 @@ onMounted(() => {
 			loopHandler = window.requestAnimationFrame(loop);
 		};
 
-		loop();
+		watch(() => props.showing, show => {
+			if (show) {
+				if (!loopHandler) {
+					loop();
+				}
+			} else if (loopHandler) {
+				window.cancelAnimationFrame(loopHandler);
+				loopHandler = undefined;
+			}
+		});
 	});
 });
 
 onUnmounted(() => {
-	window.cancelAnimationFrame(loopHandler);
+	if (loopHandler) {
+		window.cancelAnimationFrame(loopHandler);
+	}
 });
 </script>