lanxin 6 days ago
parent
commit
4dcfff22c5
3 changed files with 21 additions and 2 deletions
  1. BIN
      src/assets/img/homeBg.png
  2. 7 0
      src/pages/A0base/index.module.scss
  3. 14 2
      src/pages/A0base/index.tsx

BIN
src/assets/img/homeBg.png


+ 7 - 0
src/pages/A0base/index.module.scss

@@ -31,5 +31,12 @@
         cursor: pointer;
       }
     }
+    @media screen and (max-width: 768px) {
+      .initPic {
+        background-image: url('../../assets/img/homeBg.png');
+        background-size: none;
+        background-position: center;
+      }
+    }
   }
 }

+ 14 - 2
src/pages/A0base/index.tsx

@@ -1,16 +1,28 @@
-import React, { useState } from 'react'
+import React, { useState, useRef } from 'react'
 import isMobile from '../../utils/isMobile'
 // import A5Mobile from '../A5Mobile'
 import A1home from '../A1home'
 import styles from './index.module.scss'
 function A0base() {
   const [show, setShow] = useState(true)
+  const videoRef = useRef<HTMLVideoElement>(null)
+  const handleClick = () => {
+    if (videoRef.current && isMobile()) {
+      //是否正在播放
+      if (videoRef.current.paused) {
+        console.log('播放')
+        videoRef.current.play()
+      }
+      return
+    }
+  }
   return (
     <div className={styles.A0base}>
       {/* 初始封面 */}
       <A1home show={show} />
-      <div className='initPic' style={{ display: show ? 'flex' : 'none' }}>
+      <div className='initPic' style={{ display: show ? 'flex' : 'none' }} onClick={handleClick}>
         <video
+          ref={videoRef}
           autoPlay
           muted
           loop