33 lines
927 B
TypeScript
33 lines
927 B
TypeScript
'use client'; // 确保客户端渲染（如果在 App Router 中使用）
|
|
|
|
const FullScreenVideoBackground = ({}: {}) => {
|
|
return (
|
|
<div className='fixed inset-0 h-full w-full overflow-hidden'>
|
|
<video
|
|
autoPlay
|
|
muted
|
|
loop
|
|
controls={false}
|
|
playsInline
|
|
// webkit-playsinline // safrai 浏览器兼容
|
|
x5-playsinline={'true'} // 微信、QQ 浏览器兼容
|
|
x5-video-player-type='h5' // 同微信、QQ
|
|
x-webkit-airplay='true'
|
|
x5-video-player-fullscreen='true'
|
|
x5-video-orientation='portraint'
|
|
className='absolute inset-0 h-full w-full object-cover'
|
|
style={{
|
|
minWidth: '100%',
|
|
minHeight: '100%',
|
|
width: 'auto',
|
|
height: 'auto',
|
|
}}
|
|
>
|
|
<source src='/video.mp4' type='video/mp4' />
|
|
</video>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default FullScreenVideoBackground;
|