update kiln inner

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

@@ -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

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

@@ -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;
 }

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

@@ -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>

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

@@ -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>

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

@@ -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>