完成页面3

pages.json

@@ -23,6 +23,12 @@
       "style": {
         "navigationStyle": "custom"
       }
+    },
+	{
+	  "path": "pages/transition/page5/page5",
+	  "style": {
+	    "navigationStyle": "custom"
+	  }
 	}
   ],
   "uniIdRouter": {},

pages/transition/page4/page4.vue

@@ -1,17 +1,103 @@
 <template>
-  <view>
-
+  <view class="background">
+    <!-- 人物 -->
+    <image class="human" src="/static/transition/page4/pictures/human.png"></image>
+    <!-- 文字 -->
+    <image class="text" src="/static/transition/page4/pictures/text.png"></image>
+    <!-- 按钮 -->
+    <image class="button" @click="goToPage4" src="/static/transition/page4/pictures/button.png"></image>
   </view>
 </template>
 
 <script>
 export default {
-  data() {
-    return {};
+  methods: {
+    goToPage4() {
+      uni.navigateTo({
+        url: '/pages/transition/page5/page5' // 跳转到 page5
+      });
+    }
   }
 }
 </script>
 
 <style lang="scss">
+.background {
+  background-image: url("/static/transition/page4/pictures/background.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+}
+
+/* Human 动画，从页面中部向上移动 */
+.human {
+  position: absolute;
+  width: 100%;
+  height: 48%;
+
+  object-fit: contain; /* 保持图片比例 */
+  animation: moveUp 2s ease forwards;
+  top: 50%; /* 起始位置 */
+  transform: translateY(-50%); /* 垂直居中 */
+}
+
+/* Text 延迟显示 */
+.text {
+  position: absolute;
+  width: 90%;
+  height: 17%;
+
+  object-fit: contain; /* 保持图片比例 */
+  animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
+  opacity: 0;
+  top: 50%; /* 根据需要调整位置 */
+}
+
+/* Button 延迟显示并加缩放特效，放在右下角 */
+.button {
+  position: absolute;
+  height: 10vh;
+  width: 22vw;
+  animation: fadeInScale 1s ease 2.5s forwards; /* 2.5秒后显示并缩放 */
+  opacity: 0;
+  right: 5%; /* 距右边 5% */
+  bottom: 3%; /* 距底部 5% */
+}
 
+/* 定义 human 上移动画 */
+@keyframes moveUp {
+  from {
+    top: 50%;
+  }
+  to {
+    top: 20%; /* 移动到页面顶部 10% */
+  }
+}
+
+/* Text 和 Button 的渐入动画 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+/* Button 的缩放渐入动画 */
+@keyframes fadeInScale {
+  from {
+    opacity: 0;
+    transform: scale(0.8);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
 </style>

pages/transition/page5/page5.vue

@@ -0,0 +1,8 @@
+<template>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>

static/transition/.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/transition.iml" filepath="$PROJECT_DIR$/.idea/transition.iml" />
+    </modules>
+  </component>
+</project>

static/transition/.idea/transition.iml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

static/transition/.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$/../.." vcs="Git" />
+  </component>
+</project>

static/transition/.idea/workspace.xml

@@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ChangeListManager">
+    <list default="true" id="fe49509e-66b4-4a6b-ab2d-3ef0674550e6" name="更改" comment="">
+      <change beforePath="$PROJECT_DIR$/../../unpackage/dist/cache/.vite/deps/_metadata.json" beforeDir="false" afterPath="$PROJECT_DIR$/../../unpackage/dist/cache/.vite/deps/_metadata.json" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/../../unpackage/dist/cache/.vite/deps/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/../../unpackage/dist/cache/.vite/deps/package.json" afterDir="false" />
+    </list>
+    <option name="SHOW_DIALOG" value="false" />
+    <option name="HIGHLIGHT_CONFLICTS" value="true" />
+    <option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
+    <option name="LAST_RESOLUTION" value="IGNORE" />
+  </component>
+  <component name="Git.Settings">
+    <option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$/../.." />
+  </component>
+  <component name="ProjectId" id="2o1M2OtcNfb7BYpsadE3cgKuP5x" />
+  <component name="ProjectLevelVcsManager" settingsEditedManually="true" />
+  <component name="ProjectViewState">
+    <option name="hideEmptyMiddlePackages" value="true" />
+    <option name="showLibraryContents" value="true" />
+  </component>
+  <component name="PropertiesComponent"><![CDATA[{
+  "keyToString": {
+    "RunOnceActivity.OpenProjectViewOnStart": "true",
+    "RunOnceActivity.ShowReadmeOnStart": "true",
+    "WebServerToolWindowFactoryState": "false",
+    "last_opened_file_path": "D:/webgl-examples/examples/front",
+    "vue.rearranger.settings.migration": "true"
+  }
+}]]></component>
+  <component name="SpellCheckerSettings" RuntimeDictionaries="0" Folders="0" CustomDictionaries="0" DefaultDictionary="应用程序级" UseSingleDictionary="true" transferred="true" />
+  <component name="TaskManager">
+    <task active="true" id="Default" summary="默认任务">
+      <changelist id="fe49509e-66b4-4a6b-ab2d-3ef0674550e6" name="更改" comment="" />
+      <created>1730032420973</created>
+      <option name="number" value="Default" />
+      <option name="presentableId" value="Default" />
+      <updated>1730032420973</updated>
+      <workItem from="1730032422091" duration="31000" />
+    </task>
+    <servers />
+  </component>
+  <component name="TypeScriptGeneratedFilesManager">
+    <option name="version" value="3" />
+  </component>
+  <component name="Vcs.Log.Tabs.Properties">
+    <option name="TAB_STATES">
+      <map>
+        <entry key="MAIN">
+          <value>
+            <State />
+          </value>
+        </entry>
+      </map>
+    </option>
+  </component>
+</project>

unpackage/dist/cache/.vite/deps/_metadata.json

@@ -1,8 +1,8 @@
 {
-  "hash": "3dcffc29",
-  "configHash": "cc60d382",
+  "hash": "48f6c93b",
+  "configHash": "badd50c8",
   "lockfileHash": "e3b0c442",
-  "browserHash": "e601f541",
+  "browserHash": "debd2ea0",
   "optimized": {},
   "chunks": {}
 }