我正在创建一个视频播放器,但无法弄清楚如何通过单击我的播放按钮叠加层来播放我的视频。最终目标是通过单击按钮来播放它,按钮消失,当您想暂停时,单击视频,播放按钮会重新出现,但在我看来,当我单击时,我什至无法播放视频叠加播放按钮。
<div class="wrapper">
<video class="video" id="video" loop controls onclick="playPause()">
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4" />
</video>
<div class="playButton" onclick="playPause()"></div>
</div>
脚本
var bunnyVideo = document.getElementById("video");
function playPause() {
if (bunnyVideo.paused)
{
bunnyVideo.play();
}
else
{
bunnyVideo.pause();
}
}
最佳答案
如果您更改 JavaScript 加载类型 No wrap - in <body>
然后就可以了。
关于javascript - HTML5 视频播放按钮重叠问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42843439/