代码优化

vedio/components/home/index.vue

 <template>
 	<view class="body">
+		<view v-if="showMask" class="show-mask flex-v" @click="showMask=false">
+			<view class="mt-30" style="width: 90%;text-align: right;">
+				<image style="width: 30rpx;height: 30rpx;padding:6rpx;
+				border-radius: 40rpx;border: 2px solid darkgray;" src="@/static/index/ic_quit_white.png" />
+			</view>
+			<text class="mt-10" style="font-size: 46rpx;">如何继续看剧?</text>
+			<text class="m-10">找到“巨爽短剧” 小程序</text>
+
+			<image class="mt-30" mode="widthFix" :src="maskImage1"></image>
+			<image :src="maskImage2" mode="widthFix"></image>
+		</view>
+
 		<z-paging class="flex-1" ref="paging" v-model="dataList" @query="queryList">
 			<view class="content">
 				<swiper class="banner" :style="'margin-top:'+statusBarHeight+'px;'" :indicator-dots="true"
@@ -219,17 +231,7 @@
 			</view>
 		</uni-popup> -->
 
-		<view v-if="showMask" class="show-mask flex-v" @click="showMask=false">
-			<view class="mt-30" style="width: 90%;text-align: right;">
-				<image style="width: 30rpx;height: 30rpx;padding:6rpx;
-				border-radius: 40rpx;border: 2px solid darkgray;" src="@/static/index/ic_quit_white.png" />
-			</view>
-			<text class="mt-10" style="font-size: 46rpx;">如何继续看剧?</text>
-			<text class="m-10">找到“巨爽短剧” 小程序</text>
 
-			<image class="mt-30" mode="widthFix" :src="maskImage1"></image>
-			<image :src="maskImage2" mode="widthFix"></image>
-		</view>
 	</view>
 </template>
 <script>
@@ -416,7 +418,8 @@
 	.show-mask {
 		width: 100%;
 		height: 100%;
-		background: rgba(0, 0, 0, 0.8);
+		background: rgba(0, 0, 0, 0.6);
+		position: absolute;
 		z-index: 999;
 		color: white;
 		align-items: center;