使用React添加背景视频? [英] Adding a background video with React?
问题描述
我正在尝试构建一个包含全屏背景图像的简单登录页面,该页面将在内容加载后立即播放.
I'm trying to build a simple landing page that contains a fullscreen background image, that will play as soon as the content loads.
有没有办法在React内使用React或CSS做到这一点?
Is there a way to do this using React or CSS inside of React?
我已经尝试过使用npm模块react-drive-in,但是我一生都无法弄清楚如何在视频上加载我的React组件.该视频不断加载我的其他组件.
I've tried using the npm module react-drive-in, but I can't for the life of me figure out how to load my React components over the video. The video keeps loading over my other components.
推荐答案
import sample from './sample.mp4';
<video className='videoTag' autoPlay loop muted>
<source src={sample} type='video/mp4' />
</video>
感谢您将自动播放"从Mr_Antivius更改为自动播放".这是在React中播放视频的另一种方法.这个对我有用.请记住,sample.mp4文件与JS文件位于同一目录中.
Thank the note that 'autoplay' should be changed to 'autoPlay' from Mr_Antivius. This is an alternative way to play the video in React. It works for me. Remember that the sample.mp4 file is in the same directory of the JS file.
这篇关于使用React添加背景视频?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!