本文介绍了视频自动播放不起作用 - 试图找到解决办法的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在 React 中有视频背景.我想让它自动播放.自动播放不起作用.
我已经尝试过:
- 自动播放
- 自动播放
- autoPlay="自动播放"
我觉得特别奇怪的是,偶尔它会起作用.但随后它会停止.
这是现在的代码.
<source src={require('../../videos/background.mp4')} type="video/mp4"/></视频>
这是组件的整个部分.我正在使用过渡,但截至上周,它并没有影响它.
<Transition in={true} timeout={1000} 出现={true}>{(状态)=>(<div id="banner" className="video-foreground" style={{...transitionStyles[状态]}}><视频循环自动播放><source src={require('../../videos/background.mp4')} type="video/mp4"/></视频>
)}</过渡>
解决方案
在我的例子中添加了 静音 属性.
试试这个:
Chrome 66 会停止自动播放所有没有 静音 属性的视频.
希望有帮助.
I have a video background in React. I want it to autoplay. Autoplay does not work.
I have tried:
- autoplay
- autoPlay
- autoPlay="autoplay"
What I find particularly odd is that occasionally, it WILL work. But then it will stop.
Here is the code as it is right now.
<video loop autoPlay>
<source src={require('../../videos/background.mp4')} type="video/mp4" />
</video>
Here is the entire section of the component. I'm using a transition, but as of last week, it didn't impact it.
<div className="video-background">
<Transition in={true} timeout={1000} appear={true}>
{(state) => (
<div id="banner" className="video-foreground" style={{
...transitionStyles[state]
}}>
<video loop autoPlay>
<source src={require('../../videos/background.mp4')} type="video/mp4" />
</video>
</div>
)}
</Transition>
</div>
解决方案
Well in my case added muted property.
Try this:
<video ... autoPlay muted />
Hope it helps.
这篇关于视频自动播放不起作用 - 试图找到解决办法的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!