Is there a way to make HTML5 video fullscreen

0 votes
Is it possible to use the HTML5 video> tag to play a video in fullscreen mode?

Does anyone know whether there is a reason for this choice, if this is not possible?
Aug 5 in HTML by Tejashwini
• 1,960 points
41 views

1 answer to this question.

0 votes

Although the Fullscreen API defines an API for items to display themselves in fullscreen, HTML 5 does not offer a mechanism to make a movie fullscreen.

Any element, including videos, can use this.

Although Internet Explorer and Safari require prefixed versions, browser support is generally good.

Because the Stack Snippet sandboxing restrictions prevent it, an external demo is offered.

<div id="one">
    One
</div>

<div id="two">
    Two
</div>

<button>one</button>
<button>two</button>
div {
    width: 200px;
    height: 200px;
}
#one { background: yellow; }
#two { background: pink; }

addEventListener("click", event => {
    const btn = event.target;
    if (btn.tagName.toLowerCase() !== "button") return;
    const id = btn.textContent;
    const div = document.getElementById(id);
    if (div.requestFullscreen) 
        div.requestFullscreen();
    else if (div.webkitRequestFullscreen) 
        div.webkitRequestFullscreen();
    else if (div.msRequestFullScreen) 
      div.msRequestFullScreen();
});
answered Aug 8 by Vikas

Related Questions In HTML

0 votes
0 answers

Is there a way to change the color of the placeholder text?

I tried to change the placeholder color ...READ MORE

Jul 4 in HTML by Tejashwini
• 1,960 points
21 views
0 votes
0 answers

how to create a HTML5 video element without it being shown in the page?

how is it possible to dynamically create ...READ MORE

Jul 5 in HTML by Tejashwini
• 1,960 points
28 views
0 votes
0 answers

How to run a function when a html5 video starts playing?

When a video begins to play, I ...READ MORE

Jul 21 in HTML by Ashwini
• 1,160 points
17 views
0 votes
0 answers

What is the correct way to declare an HTML5 Doctype.?

What is the correct way to use ...READ MORE

Aug 19 in HTML by Tejashwini
• 540 points
25 views
0 votes
0 answers

How to play video in new (blank) window?

I made this: http://imgur.com/Moc84HD.jpg in WordPress. What it does ...READ MORE

May 28 in PHP by Kichu
• 19,040 points
29 views
0 votes
0 answers

HTML5 Video Autoplay not working correctly

I want the video to automatically play, ...READ MORE

Jul 12 in HTML by Ashwini
• 1,160 points
48 views
0 votes
0 answers

Video is not supported in html5

I have the latest FF and I ...READ MORE

Aug 3 in HTML by Ashwini
• 1,160 points
22 views
0 votes
0 answers

Css background video

Could someone please center the background of ...READ MORE

Aug 19 in CSS by Edureka
• 11,040 points
27 views
0 votes
1 answer

How to Identify Web Element( Button) when there are multiple buttons without any ID

Hi Gangadhar, Do you need the HTML code to ...READ MORE

answered Feb 10, 2020 in HTML by Roshni
• 10,520 points
814 views
0 votes
1 answer

How to trigger a file download when clicking an HTML button or JavaScript?

For the button you can do <form method="get" ...READ MORE

answered Aug 4 in HTML by Deepak
• 940 points
261 views
webinar REGISTER FOR FREE WEBINAR X
Send OTP
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP