我正在为我的反应网站使用ReactPlayer插件。我想在 vimeo 视频上添加自定义播放按钮和叠加图像,如下图所示。当我点击播放按钮覆盖图像和按钮需要隐藏和视频开始播放。播放器链接在这里: https ://jsfiddle.net/e6w3rtj1/<section className="vm-video"> <div className="play-btn" onClick={this.handlePlayPause}>{playing ? 'Pause' : 'Play'}> <div className="arrow"></div> </div> <div className="video-preview"> <img src={videopreviewpic} className="img-fluid" alt="video-preview-img" /> </div> <div className="vc-container player-wrapper"> <ReactPlayer onPlay={this.handlePlay} url='https://vimeo.com/361808343' className="react-player" controls width='100%' height='100%' /> </div></section>
1 回答
慕容708150
TA贡献1831条经验 获得超4个赞
使用
playIcon
播放按钮的道具。这可以是一个 JSX 元素。将海报图片 URL 传递给
light
prop。
<ReactPlayer
url="https://vimeo.com/243556536"
width="100%"
height="500px"
playing
playIcon={<button>Play</button>}
light="https://i.stack.imgur.com/zw9Iz.png"
/>
添加回答
举报
0/150
提交
取消