add:boy_height_roll page

pages/information/boy_height_end/boy_height_end.vue

@@ -7,11 +7,11 @@
     <!-- 滚动条 -->
     <image class="roll" @click="go_to_roll()" src="/static/information/boy_height/pictures/roll.png"></image>
     <!-- 按钮 -->
-    <image class="button" @click="go_to_purpose" src="/static/information/boy_height/pictures/button.png"></image>
+    <image class="button" @click="go_to_purpose()" src="/static/information/boy_height/pictures/button.png"></image>
 	<!-- 进度条 -->
 	<image class="progress" src="/static/information/boy_height/pictures/progress.png"></image>
 	<!-- 文本-->
-	<text class="text" @click="goTob_roll">{{height}}</text>
+	<text class="text" @click="go_to_roll()">{{height}}</text>
   </view>
 </template>
 
@@ -101,7 +101,7 @@ export default {
 	font-size: 1.5em; 
 	width: 100%;
 	height: 20%;
-	top: 68%; 
+	top: 69%; 
 	color:#ffffff;
 }
 </style>

pages/transition/page7/page7.vue

@@ -2,7 +2,6 @@
   <view class="background">
     <!--按钮-->
     <image class="button" @click="goToLoginPage" src="@/static/transition/page7/pictures/button.png"></image>
-
   </view>
 </template>
 
@@ -25,18 +24,30 @@ export default {
   background-position: center;
   height: 100vh;
   display: flex;
-  flex-direction: column; /* 纵向排列 */
-  align-items: center; /* 水平居中 */
-  justify-content: flex-end; /* 使内容向底部对齐 */
-  position: relative; /* 为绝对定位子元素提供相对定位的上下文 */
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-end;
+  position: relative;
+}
+
+/* 渐变显示动画 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
 }
 
 .button {
-  position: absolute; /* 绝对定位 */
+  position: absolute;
   width: 80%;
   height: 12%;
-  bottom: 5%; /* 距离底部 20% 的位置 */
-  left: 50%; /* 水平居中 */
-  transform: translateX(-50%); /* 通过 translateX 使其居中 */
+  bottom: 5%;
+  left: 50%;
+  transform: translateX(-50%);
+  opacity: 0; /* 初始为透明 */
+  animation: fadeIn 2s ease-in forwards; /* 2秒渐变显示 */
 }
 </style>