Procházet zdrojové kódy

视频样式优化

tanxue před 4 měsíci
rodič
revize
a72c6e1382
2 změnil soubory, kde provedl 25 přidání a 8 odebrání
  1. 18 1
      common/styles/global/components.scss
  2. 7 7
      pages/study/lookShipin.vue

+ 18 - 1
common/styles/global/components.scss

@@ -267,4 +267,21 @@ $titleBar-tabBar-page: calc(100vh - var(--status-bar-height));
 		.segmented-control__text{color: #333!important;}
 		.segmented-control__item--button,.segmented-control__item--button--last{height: 62rpx;border: 0;border-width: 0!important;border-radius: 8rpx;}
 		.segmented-control__item--button--active .segmented-control__text{color: #fff!important;}
-	}
+	}
+	
+//视频
+.ezy-video-box{
+	width: 606rpx;height: 394rpx;@include ezy-no-repeat-cover;margin: 0 auto 42rpx;
+	background-image: url("@/static/images/exam/video-frame-bj.png");position: relative;
+	box-sizing: border-box;padding: 18rpx;
+	.ezy-video{
+		width: 100%;height: 100%!important;
+		.prism-big-play-btn{
+			width: 87rpx;height: 87rpx;@include ezy-no-repeat-cover;background-image: url("@/static/images/course/video-play-btn.png");
+			top: 50%;left: 50%!important;transform: translate(-50%, -50%);z-index: 20;
+			.outter{border: 0;}
+			}
+		.prism-info-display{display: none;}
+		.prism-time-display .time-bound,.prism-time-display .duration{color: #fff;}
+	}
+}

+ 7 - 7
pages/study/lookShipin.vue

@@ -4,11 +4,13 @@
 			<view @click="goUpPage" class="nav-bar-icon"></view>
 			<text class="nav-bar-title">{{shipinTitle}}</text>
 		</view>
-		<view ref="videoContent" id="wgy-player-test" :playAuth="playAuth" :change:playAuth="renderScript.receiveMsg"
-			:videoId="videoId" :change:videoId="renderScript.videoIdFun" :hideFlag="hideFlag"
-			:change:hideFlag="renderScript.hideFlagFun" :progressMarkers="progressMarkers"
-			:change:progressMarkers="renderScript.progressMarkersMsg" :seekTime="seekTime"
-			:change:seekTime="renderScript.seekTimeFun" class="course-video-box">
+		<view class="ezy-video-box course-video-box">
+			<view ref="videoContent" id="wgy-player-test" :playAuth="playAuth" :change:playAuth="renderScript.receiveMsg"
+				:videoId="videoId" :change:videoId="renderScript.videoIdFun" :hideFlag="hideFlag"
+				:change:hideFlag="renderScript.hideFlagFun" :progressMarkers="progressMarkers"
+				:change:progressMarkers="renderScript.progressMarkersMsg" :seekTime="seekTime"
+				:change:seekTime="renderScript.seekTimeFun" class="ezy-video">
+			</view>
 		</view>
 		<view class="course-content-border">
 			<view class="course-content-box">
@@ -429,8 +431,6 @@
 					"mediaType": "video",
 					"encryptType": 1,
 					"progressMarkers": this.progressMarkers,
-					"width": '100%',
-					"height": '500px',
 					"autoplay": false,
 					"isLive": false,
 					"rePlay": false,