I'd like to play the video automatically in fullscreen mode when clicked the play button. So far, I have to click two buttons (go to fullscreen and play). Is there some html attribute that can join these two actions?
CodePudding user response:
There's not a single attribute for this, but you can solve this with 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>
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>
Please note, that it doesn't work in this snippet environment.