shaogen1995 6 ماه پیش
والد
کامیت
4d85903db7

+ 2 - 2
Code/public/myData/myData.js

@@ -2251,8 +2251,8 @@ const myDataTemp = {
         `,
         // 热点定位百分比
         loc: {
-          top: '67%',
-          left: '2.75%'
+          top: '76%',
+          left: '18.75%'
         }
       },
       {

+ 3 - 1
Code/src/components/VideoModel/index.tsx

@@ -7,9 +7,10 @@ type Props = {
   isShow: boolean
   src: string
   closeFu: () => void
+  controls?: boolean
 }
 
-function VideoModel({ isShow, src, closeFu }: Props) {
+function VideoModel({ isShow, src, closeFu, controls = false }: Props) {
   const videoRef = useRef<HTMLVideoElement>(null)
 
   useEffect(() => {
@@ -40,6 +41,7 @@ function VideoModel({ isShow, src, closeFu }: Props) {
         webkit-playsinline='true'
         x5-video-player-type='h5'
         onEnded={closeFu}
+        controls={controls}
       >
         <source type='video/mp4' src={src} />
         Your browser does not support the video tag.

+ 3 - 0
Code/src/pages/A1home/index.module.scss

@@ -193,6 +193,9 @@
       opacity: 0;
       pointer-events: none;
     }
+    #VideoModel {
+      z-index: 100;
+    }
   }
 
   // 屏幕>=1200

+ 32 - 0
Code/src/pages/A4dance/index.module.scss

@@ -230,5 +230,37 @@
       width: 100%;
       height: 100%;
     }
+
+    // 七盘舞 建鼓舞元素盒子
+    .A4vvBox {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      z-index: 9999;
+      padding: 6% 15% 9%;
+      opacity: 0;
+      pointer-events: none;
+      background-color: rgba(0, 0, 0, 0.6);
+      & > div {
+        width: 100%;
+        height: 100%;
+        position: relative;
+        video {
+          border-radius: 10px;
+        }
+        #VideoModel #BtnRight {
+          right: auto;
+          left: 50%;
+          transform: translateX(-50%);
+          bottom: -45px;
+        }
+      }
+    }
+    .A4vvBoxAc {
+      opacity: 1;
+      pointer-events: auto;
+    }
   }
 }

+ 20 - 10
Code/src/pages/A4dance/index.tsx

@@ -156,19 +156,29 @@ function A4dance() {
 
       {/* 左下角视频 */}
       {imgNow ? (
-        <VideoModel
-          isShow={leftVideo === 1}
-          src={baseURL + 'dance/left1.mp4'}
-          closeFu={() => setLeftVideo(0)}
-        />
+        <div className={classNames('A4vvBox', leftVideo === 1 ? 'A4vvBoxAc' : '')}>
+          <div>
+            <VideoModel
+              controls={true}
+              isShow={leftVideo === 1}
+              src={baseURL + 'dance/left1.mp4'}
+              closeFu={() => setLeftVideo(0)}
+            />
+          </div>
+        </div>
       ) : null}
 
       {imgNow ? (
-        <VideoModel
-          isShow={leftVideo === 2}
-          src={baseURL + 'dance/left2.mp4'}
-          closeFu={() => setLeftVideo(0)}
-        />
+        <div className={classNames('A4vvBox', leftVideo === 2 ? 'A4vvBoxAc' : '')}>
+          <div>
+            <VideoModel
+              controls={true}
+              isShow={leftVideo === 2}
+              src={baseURL + 'dance/left2.mp4'}
+              closeFu={() => setLeftVideo(0)}
+            />
+          </div>
+        </div>
       ) : null}
 
       {/* 点击四神云气图的动画 */}

BIN
资源/staticData/chef/4.mp4


BIN
资源/staticData/chef/6.mp4


BIN
资源/staticData/chef/7.mp4


BIN
资源/staticData/chef/8.mp4


BIN
资源/staticData/chef/9.mp4


BIN
资源/staticData/chef/bg.jpg


BIN
资源/staticData/dance/end.mp4


BIN
资源/staticData/dance/击鼓.mp4


BIN
资源/staticData/dance/踏鼓舞.mp4


BIN
资源/staticData/home/end.mp4


BIN
资源/staticData/visit/hot/hotBase.png