mt-fe-group/xuchang-screen
9
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update kiln inner

Browse Source
This commit is contained in:
lb
2023-11-07 15:19:37 +08:00
parent 74c58b570e
commit 42b221c2fb
5 changed files with 53 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/模块组件/窑炉内部/Center/index.jsx
View File

@@ -59,7 +59,7 @@ function KilnCenter() {
{/* video */}
<VideoContainer onFloorUpdate={onFloorUpdate} floor={floor} />
<div className={cls.videoLayer2}></div>
{/* <div className={cls.videoLayer2}></div> */}
{/* left side */}
{/* <div

10
src/components/模块组件/窑炉内部/Center/index.module.css
View File

@@ -25,12 +25,12 @@
}
.videoLayer2 {
width: 2416px;
height: 689px;
width: 2440px;
height: 720px;
background: url(../../../../assets/video-layer-2.png) no-repeat;
background-size: 100% 100%;
background-position: 0 0;
position: absolute;
top: 152px;
left: 32px;
position: fixed;
top: 0;
left: 0;
}

15
src/components/模块组件/窑炉内部/Center/videoComponents/EnterToFloor1.jsx
View File

@@ -1,5 +1,6 @@
import { motion, AnimatePresence } from 'framer-motion';
import { useRef, useEffect, useMemo } from 'react';
import cls from '../index.module.css';
function EnterToFloorOne(props) {
const vd = useRef(null);
@@ -47,6 +48,20 @@ function EnterToFloorOne(props) {
<video ref={vd} muted width={'100%'}>
<source src="/video/floor1.webm" type="video/mp4" />
</video>
<motion.div
className={cls.videoLayer2}
key="eto1div"
style={{
top: '340px',
left: '690px',
height: '760px',
}}
animate={{
opacity: [0, 0, 0, 0.6, 1],
transition: { duration: 0.3, delay: 2 },
}}
></motion.div>
</motion.div>
)}
</AnimatePresence>

16
src/components/模块组件/窑炉内部/Center/videoComponents/Floor1To2.jsx
View File

@@ -1,5 +1,6 @@
import { motion, AnimatePresence } from 'framer-motion';
import { useRef, useEffect, useMemo } from 'react';
import cls from '../index.module.css';
function FloorOneToTwo(props) {
const vd = useRef(null);
@@ -29,6 +30,21 @@ function FloorOneToTwo(props) {
<video ref={vd} muted width={'100%'}>
<source src="/video/1to2.webm" type="video/mp4" />
</video>
<motion.div
className={cls.videoLayer2}
key="1to2div"
style={{
top: '360px',
left: '740px',
width: '2415px',
height: '690px',
}}
animate={{
opacity: [0, 0, 0, 0.6, 1],
transition: { duration: 0.3, delay: 2 },
}}
></motion.div>
</motion.div>
)}
</AnimatePresence>

16
src/components/模块组件/窑炉内部/Center/videoComponents/Floor2To1.jsx
View File

@@ -1,5 +1,6 @@
import { motion, AnimatePresence } from 'framer-motion';
import { useRef, useEffect, useMemo } from 'react';
import cls from '../index.module.css';
function FloorTwoToOne(props) {
const vd = useRef(null);
@@ -29,6 +30,21 @@ function FloorTwoToOne(props) {
<video ref={vd} muted width={'100%'}>
<source src="/video/2to1.webm" type="video/mp4" />
</video>
<motion.div
className={cls.videoLayer2}
key="eto1div"
style={{
top: '340px',
left: '690px',
height: '760px',
width: '2460px',
}}
animate={{
opacity: [0, 0, 0, 0.6, 1],
transition: { duration: 0.3, delay: 2 },
}}
></motion.div>
</motion.div>
)}
</AnimatePresence>