HTML DOM fullscreenElement Property Last Updated : 02 Sep, 2024 Comments Improve Suggest changes Like Article Like Report The fullscreenElement property in HTML is used to return the element that is currently in fullscreen. This property may require specific prefixes to work with different browsers. Syntax:document.fullscreenElementReturn Value: Returns the element that is currently in full-screen mode, or null if full-screen mode is not available. Example: In this example, we will see the use of fullscreenElement property. HTML <!DOCTYPE html> <html> <head> <title>fullscreenElement method</title> </head> <body> <h1 style="color: green">GeeksForGeeks</h1> <p><b>fullscreenElement method</b></p> <p>The current fullscreen element will appear in the console after 5 seconds.</p> <img id="image" src= "https://media.geeksforgeeks.org/wp-content/uploads/sample_image.png" /> <br> <button onclick="goFullScreen();">Go fullscreen</button> <script> /* Log the element currently in fullscreen */ function checkFullscreenElement() { console.log( /* Standard syntax */ document.fullscreenElement || /* Chrome, Safari and Opera syntax */ document.webkitFullscreenElement || /* Firefox syntax */ document.mozFullScreenElement || /* IE/Edge syntax */ document.msFullscreenElement ) } /* Call this function after 5 seconds, as we cannot click any button to execute this function while in fullscreen */ setTimeout(checkFullscreenElement, 5000); /* Go fullscreen */ function goFullScreen() { if ( /* Standard syntax */ document.fullscreenEnabled || /* Chrome, Safari and Opera syntax */ document.webkitFullscreenEnabled || /* Firefox syntax */ document.mozFullScreenEnabled || /* IE/Edge syntax */ document.msFullscreenEnabled ) { elem = document.querySelector('#image'); /* Try to go Fullscreen */ elem.requestFullscreen(); } else { console.log('Fullscreen is not available currently.') } } </script> </body> </html> Output: Supported Browsers: The browser supported by fullscreenElement property are listed below:Google ChromeEdge FirefoxOperaSafari Comment More infoAdvertise with us S sayantanm19 Follow Improve Article Tags : Web Technologies HTML Web technologies HTML-DOM HTML-Property +1 More Similar Reads HTML DOM Header Object The DOM header object is used to represent the HTML <header> element. The header element can be accessed by the getElementById() method. Syntax: document.getElementById("id"); Where ‘id’ is the ID assigned to the header tag. Example 1: In the below program the header element is accessed and th 1 min read HTML DOM Style border Property The HTML DOM Style border Property is used to set or return the style of an element's border. We can set the different styles of the border for individual sides (top, right, bottom, left). The border-style property can take multiple values for each side. SyntaxIt is used to return the Style Propert 2 min read HTML DOM Span Object The DOM span object is used to represent the HTML <span> element. The span element can be accessed by using the getElementById() method. Syntax: document.getElementById("id"); Where 'id' is the ID assigned to the span tag. Example 1: In the below program the content inside the span element is 1 min read HTML DOM Input Button Object The DOM Input Type Button Object is used to represent the HTML <input> element with type="button". The Input Type Button element is accessed by getElementById(). Syntax: document.getElementById("ID"); Where “id†is the ID assigned to the “input†tag. Example 1: In this example, we will see the 2 min read HTML DOM Address Object The DOM address object is used to represent the HTML <address> element. The address element can be accessed using the getElementById() method. Syntax: document.getElementById("id"); Where ‘id’ is the ID assigned to the address tag. Example 1: In the below program the address element is accesse 1 min read HTML DOM dl Object The DOM dl object is used to represent the HTML <dl> element. The dl element can be accessed using the getElementById() method. The dl is used to create a description list in HTML. Syntax: document.getElementById("id"); Where ‘id’ is the ID assigned to the dl tag. Example 1: In the below progr 1 min read HTML | DOM DT Object The DOM dt object is used to represent the HTML <dt> element. The dt element can be accessed using the getElementById() method. Syntax: document.getElementById("id"); Where ‘id’ is the ID assigned to the dt tag. Example-1: html <!DOCTYPE html> <html> <body> <h1 style = 1 min read HTML | DOM Style borderTopColor Property The borderTopColor property allows us to set/get the color of top border of element. Syntax: It returns the borderTopColor property. object.style.borderTopColorIt is used to set the borderTopColor property. object.style.borderTopColor = "color|transparent|initial| inherit" Return Value:The borderTop 2 min read HTML DOM Style borderLeftColor Property The borderLeftColor property in HTML DOM allows us to set/get the color to the left border of an element. Syntax: It is used to return the borderLeftColor property. object.style.borderLeftColorIt is used to set the borderLeftColor property. object.style.borderLeftColor = "color | transparent | ini 2 min read HTML DOM Paragraph Object The DOM paragraph object is used to represent the HTML <p> element. The p element is accessed by getElementById(). Syntax: document.getElementById("id"); Where ‘id’ is the ID assigned to the p tag. The below programs illustrate the p object: Property Values align: It is used to set or return t 2 min read Like