点击播放按钮后，自动全屏播放视频

Question

我想在点击播放按钮时以全屏模式自动播放视频。到目前为止，我必须点击两个按钮(进入全屏播放)。是否有一些html属性可以连接这两个动作?

Answer 1

这不是一个单一的属性，但你可以用JavaScript解决这个问题:

document.getElementById("videoplayer").addEventListener("playing", event => {
const player = document.getElementById("videoplayer");
if (player.requestFullscreen) 
player.requestFullscreen();
else if (player.webkitRequestFullscreen) 
player.webkitRequestFullscreen();
else if (player.msRequestFullScreen) 
player.msRequestFullScreen();
})

<video id="videoplayer" src="https://www.w3schools.com/tags/movie.mp4" controls></video>

请注意，它在这个代码片段环境中不起作用。