How to Open a Page In Full Screen Mode using JavaScript

July 4, 2009

How to Open a Page In Full Screen Mode using JavaScript

Saturday, July 04, 2009 Posted by Suprotim Agarwal
Labels: ASP.NET, JavaScript

One of my team members had a requirement of opening up a page in Full Screen mode. He wanted that when a link on the page is clicked, the same page should be opened in Full Screen Mode. If you too have a similar requirement, then here’s how to do so:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Open Page FullScreen</title>
    <script type="text/javascript">  
    function   FullScreenMode(){
        var win = window.open("", "full", "dependent=yes, fullscreen=yes");
        win.location = window.location.href;
        window.opener = null;
    }  
   
    </script>
   
</head>
<body>
    <input id="Button1" type="button" value="Full Screen"
    onclick="FullScreenMode()"/>
</body>
</html>

If you want the parent window to close when the new window opens in full screen mode, just add window.close(); as the last line in the JavaScript code.