diff --git a/src/layouts/modules/global-content/index.vue b/src/layouts/modules/global-content/index.vue
index ef40088e4..8c7b7f454 100644
--- a/src/layouts/modules/global-content/index.vue
+++ b/src/layouts/modules/global-content/index.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { computed } from 'vue';
 import { useAppStore } from '@/store/modules/app';
 import { useThemeStore } from '@/store/modules/theme';
 import { useRouteStore } from '@/store/modules/route';
@@ -19,12 +20,14 @@ withDefaults(defineProps<Props>(), {
 const appStore = useAppStore();
 const themeStore = useThemeStore();
 const routeStore = useRouteStore();
+
+const transitionName = computed(() => (themeStore.page.animate ? themeStore.page.animateMode : ''));
 </script>
 
 <template>
   <RouterView v-slot="{ Component, route }">
     <Transition
-      :name="themeStore.page.animateMode"
+      :name="transitionName"
       mode="out-in"
       @before-leave="appStore.setContentXScrollable(true)"
       @after-enter="appStore.setContentXScrollable(false)"
diff --git a/src/store/modules/app/index.ts b/src/store/modules/app/index.ts
index c58cb6400..67230a11a 100644
--- a/src/store/modules/app/index.ts
+++ b/src/store/modules/app/index.ts
@@ -35,11 +35,11 @@ export const useAppStore = defineStore(SetupStoreId.App, () => {
   async function reloadPage(duration = 300) {
     setReloadFlag(false);
 
-    if (duration > 0) {
-      await new Promise(resolve => {
-        setTimeout(resolve, duration);
-      });
-    }
+    const d = themeStore.page.animate ? duration : 40;
+
+    await new Promise(resolve => {
+      setTimeout(resolve, d);
+    });
 
     setReloadFlag(true);
   }