瀏覽代碼

修復bug

tremble 3 年之前
父節點
當前提交
95c8ccec73
共有 2 個文件被更改,包括 8 次插入3 次删除
  1. 1 0
      src/components/Controls/Panel/Main.vue
  2. 7 3
      src/components/openVideo/index.vue

+ 1 - 0
src/components/Controls/Panel/Main.vue

@@ -197,6 +197,7 @@ const brandScroll = () => {
         spaceBetween: 10,
         grid: {
           rows: 2,
+          fill: 'row'
         },
         on: {
           touchMove(swiper, e) {

+ 7 - 3
src/components/openVideo/index.vue

@@ -1,8 +1,8 @@
 <template>
   <transition appear name="custom-classes-transition" leave-active-class="animated fadeOut faster">
     <div class="open-video">
+      <video x5-playsinline="true" ref="bgvideo$" playsinline="true" webkit-playsinline="true" class="bgvideo" preload autoplay :src="videourl"></video>
       <div class="vmask"></div>
-      <video x5-playsinline="true" playsinline="true" webkit-playsinline="true" class="bgvideo" preload autoplay :src="videourl"></video>
       <video x5-playsinline="true" playsinline="true" webkit-playsinline="true" class="video" ref="openvideo$" preload autoplay :src="videourl"></video>
       <div @click.stop="emit('close')" class="jump">跳過</div>
     </div>
@@ -13,6 +13,8 @@ import { ref, watch, defineEmits, computed, onMounted, nextTick, defineProps } f
 import * as apis from "@/apis/index.js";
 
 const openvideo$ = ref(null);
+const bgvideo$ = ref(null);
+
 const videourl = ref(null);
 
 const emit = defineEmits(["close"]);
@@ -32,6 +34,7 @@ onMounted(() => {
       "WeixinJSBridgeReady",
       () => {
         openvideo$.value.play();
+        bgvideo$.value.play();
       },
       false
     );
@@ -55,10 +58,11 @@ onMounted(() => {
     top: 0;
     bottom: 0;
     right: 0;
-    z-index: -1;
+    z-index: 1;
     height: 100%;
     width: auto;
     object-fit: fill;
+    backdrop-filter: blur(10px);
     // filter: blur(10px);
   }
   .vmask {
@@ -68,7 +72,7 @@ onMounted(() => {
     bottom: 0;
     right: 0;
     display: inline-block;
-    z-index: 0;
+    z-index: 2;
     backdrop-filter: blur(10px);
   }
   .video {