提交

src/view/SilkRoadSpringFestivalGala/index.vue

@@ -36,6 +36,21 @@
         class="video"
         v-show="page === 'fourth' || page === 'five' || page === 'sex'"
       ></video>
+      <video
+        muted
+        loop
+        x5-video-player-type="h5"
+        preload="metadata"
+        autoplay
+        playsinline="true"
+        webkit-playsinline="true"
+        x-webkit-airplay="true"
+        x5-video-orientation="portraint"
+        x5-video-player-fullscreen="true"
+        src="../../assets/video/bg1.mp4"
+        class="video"
+        v-show="page === 'second'"
+      ></video>
       <transition name="fade">
         <second v-if="page === 'second'" @changePage="changePage" />
       </transition>
@@ -86,9 +101,12 @@ audio.loop = true;
 
 function tosecond() {
   changePage("second");
-  const video = document.querySelector("video");
-  console.log(video.playing, audio.playing);
-  !video.playing && video.play();
+  const video = document.querySelectorAll("video");
+  console.log(video, audio.playing);
+  for (let i = 0; i < video.length; i++) {
+    const v = video[i];
+    !v.playing && v.play();
+  }
   !audio.playing && audio.play();
 }
 // onMounted(() => {
@@ -106,7 +124,7 @@ function changePage(type) {
     position: absolute;
     top: 50%;
     left: 50%;
-    transform: translate(-50%,-50%);
+    transform: translate(-50%, -50%);
   }
   .loading {
     width: 4em;
@@ -211,7 +229,6 @@ function changePage(type) {
     position: relative;
     transition: all 5s;
     opacity: 1;
-
     .head {
       display: block;
       margin: 0 auto;

src/view/SilkRoadSpringFestivalGala/pages/second.vue

@@ -37,8 +37,8 @@ function close() {
 <style lang="scss" scoped>
 .second {
   position: relative;
-  background-image: url("../../../assets/img/silubg.jpg");
-  background-size: 100% 100%;
+//   background-image: url("../../../assets/img/silubg.jpg");
+//   background-size: 100% 100%;
   .title{
     position: absolute;
     width: 15em;