This commit is contained in:
lb 2023-11-08 16:49:34 +08:00
parent b502490e7a
commit 0b0ec8fd67
5 changed files with 27 additions and 15 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 426 KiB

View File

@ -33,4 +33,14 @@
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
}
.videoLayer1 {
width: 2440px;
height: 720px;
background: url(../../../../assets/floor1-status.png) no-repeat;
background-size: 100% 100%;
background-position: 0 0;
position: fixed;
top: 0;
left: 0;
} }

View File

@ -37,6 +37,7 @@ function EnterToFloorOne(props) {
width: '100%', width: '100%',
height: '100%', height: '100%',
zIndex: -999, zIndex: -999,
overflow: 'hidden',
}} }}
initial={{ opacity: 0 }} initial={{ opacity: 0 }}
animate={{ opacity: 1 }} animate={{ opacity: 1 }}
@ -68,12 +69,12 @@ function EnterToFloorOne(props) {
)} )}
<motion.div <motion.div
className={cls.videoLayer2} className={cls.videoLayer1}
key="eto1div" key="eto1div"
style={{ style={{
top: '340px', top: '336px',
left: '690px', left: '730px',
height: '720px', width: '2380px',
}} }}
animate={{ animate={{
opacity: [0, 0, 0, 0.6, 1], opacity: [0, 0, 0, 0.6, 1],

View File

@ -36,15 +36,16 @@ function FloorOneToTwo(props) {
position: 'fixed', position: 'fixed',
top: '7px', top: '7px',
left: '50px', left: '50px',
width: '100%', width: 'calc(100% - 50px)',
height: '100%', height: 'calc(100% - 7px)',
zIndex: -998, zIndex: -998,
overflow: 'clip',
}} }}
initial={{ opacity: 0 }} initial={{ opacity: 0 }}
animate={{ opacity: 1 }} animate={{ opacity: 1 }}
exit={{ opacity: 0, transition: { duration: 0, delay: 0.1 } }} exit={{ opacity: 0, transition: { duration: 0, delay: 0.1 } }}
> >
<video ref={vd} muted width={'100%'}> <video ref={vd} muted>
<source src="/video/1to2.webm" type="video/mp4" /> <source src="/video/1to2.webm" type="video/mp4" />
</video> </video>

View File

@ -36,15 +36,16 @@ function FloorTwoToOne(props) {
position: 'fixed', position: 'fixed',
top: '7px', top: '7px',
left: '50px', left: '50px',
width: '100%', width: 'calc(100% - 50px)',
height: '100%', height: 'calc(100% - 7px)',
zIndex: -998, zIndex: -998,
overflow: 'clip',
}} }}
initial={{ opacity: 0 }} initial={{ opacity: 0 }}
animate={{ opacity: 1 }} animate={{ opacity: 1 }}
exit={{ opacity: 0, transition: { duration: 0.2, delay: 0.2 } }} exit={{ opacity: 0, transition: { duration: 0.2, delay: 0.2 } }}
> >
<video ref={vd} muted width={'100%'}> <video ref={vd} muted>
<source src="/video/2to1.webm" type="video/mp4" /> <source src="/video/2to1.webm" type="video/mp4" />
</video> </video>
@ -72,13 +73,12 @@ function FloorTwoToOne(props) {
)} )}
<motion.div <motion.div
className={cls.videoLayer2} className={cls.videoLayer1}
key="eto1div" key="eto1div"
style={{ style={{
top: '340px', top: '336px',
left: '690px', left: '730px',
height: '760px', width: '2380px',
width: '2460px',
}} }}
animate={{ animate={{
opacity: [0, 0, 0, 0.6, 1], opacity: [0, 0, 0, 0.6, 1],