如何解决ReactPlayer高度缩放以适合页面之外
在我的页面上,有一个视频,我想覆盖整个网页的屏幕。但是,到目前为止,用户必须稍微滚动一下才能到达底部,这不是我想要的。
我的JS:
<div id="page">
<div id="video-container">
<ReactPlayer
id="video-player"
playing
url={flower}
width='100%'
height='100%'
muted={true}
loop
/>
</div>
</div>
我的CSS:
#video-container {
position: relative;
display: flex;
width: auto;
height: auto;
}
#video-player {
}
我开玩笑地向视频播放器添加了CSS属性,但是没有任何效果,所以这就是为什么它现在是空的。不知道我需要调整什么。
解决方法
为视频播放器提供100vh的高度并隐藏它的溢出。
#video-container {
position: relative;
display: flex;
width: auto;
height: 100vh;
overflow: hidden;
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。